Ⅰ 怎么实现鼠标点击input输入框弹出一个日期选择框
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>点击text文本框弹出日期选择器</title>
<!--可无视-->
<styletype="text/css">
body{margin:0;padding:0;font:14pxVerdana,Arial,sans-serif;line-height:200%;}
#content{padding-left:50px;padding-right:50px;}
#contenth2{font-size:18px;color:#1E9300;padding-top:8px;margin-bottom:8px;}
#contenth3{margin-top:8px;margin-bottom:8px;FONT:bold14px宋体,tahoma,arial,sans-serif;COLOR:#0033CC;}
#contentdiv{margin-top:10px;margin-bottom:10px;border:#666solid1px;padding:10px;}
#contentspan{color:#f00;font-weight:bold;}
ul,ol{color:#000000;}
</style>
<!--必要js文件/样式表已经引入在js里面了-->
<scripttype="text/javascript"src="lhgcore.js"></script>
<scripttype="text/javascript"src="lhgcalendar.js"></script>
</head>
<body>
<divid="content">
<h2>常规弹出日历示例页</h2>
<hrsize="1"style="width:400px;"align="left">
<h3>1.在控件下面或右面弹出日历组件(默认是在下面弹出)</h3>
<div>
<inputtype="text"id="c1"onclick="J.calendar.get();"/>显示在下面
<inputtype="text"id="c2"onclick="J.calendar.get({dir:'right'});"/>显示在右面
</div>
<h3>2.通过按钮或图片等其它控件弹出日历组件</h3>
<div>
<inputtype="text"id="c3"/>
<inputtype="button"id="btn"onclick="J.calendar.get({id:'c3'});"value="弹出"/>
<inputtype="text"id="c4"/>
<imgalign="absmiddle"src="images/date.gif"onclick="J.calendar.get({id:'c4'});"/>
</div>
<h3>3.显示日期的2种格式(默认为年-月-日格式)</h3>
<div>
<inputtype="text"id="c5"onclick="J.calendar.get();"/>年-月-日格式
<inputtype="text"id="c6"onclick="J.calendar.get({type:'/'});"/>月/日/年格式
</div>
<h3>4.在文本框显示带时间的日期</h3>
<div>
<inputtype="text"id="c7"onclick="J.calendar.get({time:true});"/>
</div>
<h3>5.日期范围限制</h3>
<div>
<inputtype="text"id="c8"onclick="J.calendar.get({to:'2009-8-8,min'});"/>只能选择2009-8-8以前的日期
<inputtype="text"id="c9"onclick="J.calendar.get({to:'2009-8-18,max'});"/>只能选择2009-8-18以后的日期<br/>
<inputtype="text"id="c10"onclick="J.calendar.get({to:'c11,min'});"/>
<inputtype="text"id="c11"onclick="J.calendar.get({to:'c10,max'});"/>这2个文本框,前面的日期不能大于后面的日期,后面的不能小于前面的日期。
</div>
</div>
<divstyle="text-align:center;margin:50px0;font:normal14px/24px'MicroSoftYaHei';">
</div>
</body>
</html>