js如何做到点击文本框弹出日历？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js如何做到点击文本框弹出日历？相关的知识，希望对你有一定的参考价值。
希望给一段实例代码！谢谢！
参考技术A demo.htm // demo实例<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns=" http://www.w3.org/1999/xhtml">
<head><title>
无标题页
</title>
<script type="text/javascript" src="Calendar.js"></script>
</head>
<body>
<form name="form1" method="post" action="Default3.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJLTcyMDUyOTIyZGRKyTJtRcvRJ0v4IJi40MBOayccLg==" />
</div>
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
</div>
<div>
<table border="0px" style="margin:0;padding:0;height:22px;padding:0;" cellpadding="0" cellspacing="0" name="Calendar1" OnInitialzation="__doPostBack('Calendar1','')"><tr><td id="calendar_td" style="border-right:0;"><input id="show_Calendar1" type="text" style="margin:0;padding:0;height:18px;width:130px;" value="2011-01-13" onkeydown="SelectText(event,'show_Calendar1');CanNotDelete(event);" onchange="OnTextChange('show_Calendar1','1');" /></td><td style="border-left:0;"><img src="img/ico.gif" style="height:18px;" onclick="Initiailzation('show_Calendar1','1');" /></td><td style="border-right:0;"><div id="showError_Calendar1" style="height:18px;font-size:12px;color:#FF0000;padding-top:8px;"></div></td><td colspan="3"><div id="calendar_Calendar1"></div></td></tr></table>
</div>
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm)
theForm = document.form1;
function __doPostBack(eventTarget, eventArgument)
if (!theForm.onsubmit || (theForm.onsubmit() != false))
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
//]]>
</script>
</form>
</body>
</html>
这是前段时间写的一个日历控件，封装成服务器自定义控件了，不过可以直接调用js，以上是js源码和demo实例，已经兼容ie/6/7/8，firefox，safari等主流浏览器，希望对你有帮助，如需要完整源码，请联系
附：js内容过多，无法在这发出来
Android 点击输入框弹出键盘，布局随键盘往上移动
参考技术A 一、效果图：二、Code：
/**
* 1、获取main在窗体的可视区域
* 2、获取main在窗体的不可视区域高度
* 3、判断不可视区域高度，之前根据经验值，在有些手机上有点不大准，现改成屏幕整体高度的1/3
* 1、大于屏幕整体高度的1/3：键盘显示 获取Scroll的窗体坐标
* 算出main需要滚动的高度，使scroll显示。
* 2、小于屏幕整体高度的1/3：键盘隐藏
*
* @param main 根布局
* @param scroll 需要显示的最下方View
*/
public static void addLayoutListener(final View main, final View scroll)
main.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener()
@Override
public void onGlobalLayout()
Rect rect = new Rect();
main.getWindowVisibleDisplayFrame(rect);
int screenHeight = main.getRootView().getHeight();
int mainInvisibleHeight = main.getRootView().getHeight() - rect.bottom;
if (mainInvisibleHeight > screenHeight / 4)
int[] location = new int[2];
scroll.getLocationInWindow(location);
int srollHeight = (location[1] + scroll.getHeight()) - rect.bottom;
main.scrollTo(0, srollHeight);
else
main.scrollTo(0, 0);
);
三、调用方式：
在Activity的onCreate()中调用，
仅此记录。
以上是关于js如何做到点击文本框弹出日历？的主要内容，如果未能解决你的问题，请参考以下文章