标签:
http://www.my97.net/dp/demo/
<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, minimal-ui"> <meta name="apple-mobile-web-app-capable" content="yes" /> <title>日期插件</title> <script language="javascript" type="text/javascript" src="My97DatePicker/WdatePicker.js"></script> <!-- 地址:http://www.my97.net/dp/demo/resource/2.1.asp --> <style> *{ margin:0; padding:0;} div.main{ max-width:640px; width:100%; margin:0 auto;} div.demo{ margin:20px 0;} </style> </head> <body> <div class="main"> <p>演示地址:http://www.my97.net/dp/demo/resource/2.1.asp</p> <div class="demo"> <font color=red>选择日期:(周末高亮)</font> <input class="Wdate" type="text" onClick="WdatePicker()"> </div> <div class="demo"> <font color=red>选择日期:</font> <input class="Wdate" type="text" onClick="WdatePicker()" onfocus="WdatePicker({readOnly:true,highLineWeekDay:false})"> </div> <div class="demo"> <font color=red>自定义星期的第一天</font> <input class="Wdate" type="text" onClick="WdatePicker()" onfocus="WdatePicker({readOnly:true,firstDayOfWeek:2})"> </div> <div class="demo"> <input id="d12" type="text"/> <img onclick="WdatePicker({el:‘d12‘})" src="My97DatePicker/skin/datePicker.gif" width="16" height="22" align="absmiddle"> </div> <div class="demo"> <input id="d121" type="text" onfocus="WdatePicker({isShowWeek:true})"/> </div> <div class="demo"> <input type="text" class="Wdate" id="d122" onFocus="WdatePicker({isShowWeek:true,onpicked:function() {$dp.$(‘d122_1‘).value=$dp.cal.getP(‘W‘,‘W‘);$dp.$(‘d122_2‘).value=$dp.cal.getP(‘W‘,‘WW‘);}})"/> 您选择了第<input type="text" size="3" id="d122_1">周 (W格式)周, 另外您可以使用WW格式:<input id="d122_2" type="text" size="3">周 </div> <div class="demo"> <b>禁用清空按钮</b> <input class="Wdate" type="text" id="d15" onFocus="WdatePicker({isShowClear:false,readOnly:true})"/> </div> <div class="demo"> <b>通过position属性,自定义弹出位置</b> <input class="Wdate" type="text" id="d16" onfocus="WdatePicker({position:{left:100,top:50}})"/> </div> <div class="demo"> <font color=red>两个日期</font> <input class="Wdate" type="text" onClick="WdatePicker({doubleCalendar:true})" > </div> <div class="demo"> <font color=red>修改日期格式,时间格式,皮肤</font> <input class="Wdate" type="text" onClick="WdatePicker({dateFmt:‘yyyy.MM.dd‘,realTimeFmt:‘HH:mm:ss‘,realFullFmt:‘%Date %Time‘,skin:‘whyGreen‘})" > </div> <div class="demo"> <font color=red>最大日期 、最小日期</font> <input class="Wdate" type="text" onClick="WdatePicker({doubleCalendar:true,minDate:‘2014-01-01 00:00:00‘,maxDate:‘2016-01-01 00:00:00‘})" > </div> <div class="demo"> <font color=red>设置起始时间</font> <input type="text" id="d221" onFocus="WdatePicker({startDate:‘1980-05-01‘})"/> </div> <div class="demo"> <font color=red>设置某天无效</font> <input id="d441" type="text" class="Wdate" onFocus="WdatePicker({disabledDays:[3]})"/> </div> <div class="demo"> <font color=red>实现日期选择联动 从某天 到某天</font> <input id="d5221" class="Wdate" type="text" onFocus="var d5222=$dp.$(‘d5222‘);WdatePicker({onpicked:function(){d5222.focus();},maxDate:‘#F{$dp.$D(\‘d5222\‘)}‘})"/>至 <input id="d5222" class="Wdate" type="text" onFocus="WdatePicker({minDate:‘#F{$dp.$D(\‘d5221\‘)}‘})"/> </div> <div class="demo"> <input type="text" id="d523_y" size="5"/> 年 <input type="text" id="d523_M" size="3"/> 月 <input type="text" id="d523_d" size="3"/> 日 <input type="text" id="d523_HH" size="3"/> 时 <input type="text" id="d523_mm" size="3"/> 分 <input type="text" id="d523_ss" size="3"/> 秒 <input id="d523" type="text"> <img onclick="WdatePicker({el:‘d523‘,dateFmt:‘yyyy-MM-dd HH:mm:ss‘,onpicked:pickedFunc})" src="My97DatePicker/skin/datePicker.gif" width="16" height="22" align="absmiddle" style="cursor:pointer"/> <script> function pickedFunc(){ $dp.$(‘d523_y‘).value=$dp.cal.getP(‘y‘); $dp.$(‘d523_M‘).value=$dp.cal.getP(‘M‘); $dp.$(‘d523_d‘).value=$dp.cal.getP(‘d‘); $dp.$(‘d523_HH‘).value=$dp.cal.getP(‘H‘); $dp.$(‘d523_mm‘).value=$dp.cal.getP(‘m‘); $dp.$(‘d523_ss‘).value=$dp.cal.getP(‘s‘); } </script> </div> <div class="demo"> </div> <div class="demo"> </div> <div class="demo"> </div> <div class="demo"> </div> <div class="demo"> </div> <div class="demo"> </div> <div class="demo"> </div> <div class="demo"> </div> </div> </body> </html>
标签:
原文地址:http://www.cnblogs.com/shimily/p/4531078.html