|
<!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>
|
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
|
<meta name="keywords" content="ÈÕÆڿؼþ datepicker calendar ÈÕÀú¿Ø¼þ javascript jsÈÕÀú¿Ø¼þ ´øʱ¼ä ×Ô¶¨Òå¸ñʽ ÔÂÀú¿Ø¼þ ÈÕÆÚʱ¼ä ÈÕÆÚÑ¡Ôñ" />
|
<title>My97ÈÕÆڿؼþ ¹¦ÄÜÑÝʾ ³£¹æ¹¦ÄÜ My97 Datepicker Demo</title>
|
<link href="../../css/base.css" tppabs="http://www.my97.net/dp/css/base.css" rel="stylesheet" type="text/css" />
|
<link href="demo.css" tppabs="http://www.my97.net/dp/demo/resource/demo.css" rel="stylesheet" type="text/css" />
|
</head>
|
<body>
|
<iframe src="../../head.asp" tppabs="http://www.my97.net/dp/head.asp" scrolling="no" frameborder="0" height="100px" width="100%"></iframe>
|
<script language="JavaScript" type="text/javascript" src="../../../WdatePicker.js" tppabs="http://www.my97.net/dp/My97DatePicker/WdatePicker.js"></script>
|
<div class="dCenter dBody">
|
<div id="content">
|
|
|
<h2>¶þ. ¹¦Äܼ°Ê¾Àý<a name="m2" id="m2"></a></h2>
|
<h3>1. ³£¹æ¹¦ÄÜ<a name="m21" id="m21"></a></h3>
|
<ol>
|
<li>Ö§³Ö¶àÖÖµ÷ÓÃģʽ <a name="m211" id="m211"></a>
|
<p>³ýÁËÖ§³Ö³£¹æÔÚinputµ¥»÷»ò»ñµÃ½¹µãµ÷ÓÃÍâ,»¹Ö§³ÖʹÓÃÆäËûµÄÔªËØÈç:<img><div>µÈ´¥·¢WdatePickerº¯ÊýÀ´µ÷Óõ¯³öÈÕÆÚ¿ò</p>
|
<div>
|
<h4>ʾÀý1-1-1 ³£¹æµ÷ÓÃ</h4>
|
<p>
|
<input type="text" id="d11" onClick="WdatePicker()"/>
|
<br />
|
<input id="d11" type="text" <span class="STYLE1">onClick="WdatePicker()"</span>/></p>
|
</div>
|
<div>
|
<h4>ʾÀý1-1-2 ͼ±ê´¥·¢</h4>
|
<p>
|
<input id="d12" type="text"/>
|
<img src="../../../skin/datePicker.gif" tppabs="http://www.my97.net/dp/My97DatePicker/skin/datePicker.gif" width="16" height="22" align="absmiddle" style="cursor:pointer" onClick="WdatePicker({el:'d12'})" /> <br />
|
<input id="<span class="STYLE1">d12</span>" type="text"/><br />
|
<img onclick="WdatePicker({<span class="STYLE2">el:</span><span class="STYLE1">'d12'</span>})" src="../skin/datePicker.gif" width="16" height="22" align="absmiddle"><br />
|
<span class="STYLE1">×¢Òâ:</span>Ö»ÐèÒª´«Èë¿Ø¼þµÄid¼´¿É</p>
|
</div>
|
</li>
|
<li>ÏÂÀ,ÊäÈë,µ¼º½Ñ¡ÔñÈÕÆÚ<a name="m212" id="m212"></a>
|
<p>ÄêÔÂʱ·ÖÃëÊäÈë¿ò¶¼¾ß±¸ÒÔÏÂÈýÖÖÌØÐÔ <br />
|
1.
|
ͨ¹ýµ¼º½Í¼±êÑ¡Ôñ<br />
|
<img src="pic1.jpg" tppabs="http://www.my97.net/dp/demo/resource/pic1.jpg" width="180" height="197" /><br />
|
<br />
|
2. Ö±½ÓʹÓüüÅÌÊäÈëÊý×Ö<br />
|
<img src="pic2.jpg" tppabs="http://www.my97.net/dp/demo/resource/pic2.jpg" width="180" height="197" /><br />
|
<br />
|
3. Ö±½Ó´Óµ¯³öµÄÏÂÀ¿òÖÐÑ¡Ôñ<br />
|
<img src="pic3.jpg" tppabs="http://www.my97.net/dp/demo/resource/pic3.jpg" width="180" height="197" /><br />
|
<br />
|
<span class="STYLE2">Áí:Äê·ÝÊäÈë¿òÓÐÖÇÄÜÌáʾ¹¦ÄÜ,µ±Óû§Á¬Ðøµã»÷ͬһ¸öµ¼º½°´Å¥5´Îʱ,»á×Ô¶¯µ¯³öÄê·ÝÏÂÀ¿ò</span></p>
|
</li>
|
<li>Ö§³ÖÖÜÏÔʾ <a name="m213" id="m213"></a>
|
<p>¿ÉÒÔͨ¹ýÅäÖÃisShowWeekÊôÐÔ¾ö¶¨ÊÇ·ñÏÞÖÆÖÜ,²¢ÇÒÔÚ·µ»ØÈÕÆÚµÄʱºò»¹¿ÉÒÔͨ¹ý×Ô´øµÄ×Ô¶¨ÒåʼþºÍAPIº¯Êý·µ»ØÑ¡ÔñµÄÖÜ</p>
|
<br />
|
<div>
|
<h4>ʾÀý1-2-1 ÖÜÏÔʾ¼òµ¥Ó¦Óà </h4>
|
<p>
|
<input id="d121" type="text" onfocus="WdatePicker({isShowWeek:true})"/>
|
<br />
|
<input id="d121" type="text" onfocus="WdatePicker({<span class="STYLE2">isShowWeek:</span><span class="STYLE1">true</span>})"/><br />
|
<br />
|
<span class="STYLE1">×¢Òâ:ÖÜËã·¨²Î¿¼µÄÊÇISO8601¶¨ÒåµÄ·½·¨,Èç¹ûÄú¶Ô´ËÓÐÒÉÎÊ,ÇëÏê¼û:</span><a href="javascript:if(confirm('http://en.wikipedia.org/wiki/ISO_week_date \n\n¸ÃÎļþδ±» Teleport Pro ÏÂÔØ£¬ÒòΪ ËüλÓÚÆðʼµØÖ·ÒÔÉèÖõı߽çÒÔÍâµÄÓò»ò·¾¶ÖС£ \n\nÄãÏëÒª´Ó·þÎñÆ÷´ò¿ªËüÂð?'))window.location='http://en.wikipedia.org/wiki/ISO_week_date'" tppabs="http://en.wikipedia.org/wiki/ISO_week_date" target="_blank">http://en.wikipedia.org/wiki/ISO_week_date</a><br />
|
<br />
|
ÖÜË㷨ѡÔñ<span class="STYLE1">(4.8ÐÂÔö)</span><br />
|
Ïà¹ØÊôÐÔ:<span class="STYLE2">weekMethod</span><br />
|
ÖÜËã·¨²»Í¬µÄµØ·½ÓÐһЩ²îÒì<br />
|
³£¼ûËã·¨ÓÐÁ½ÖÖ<br />
|
1. ISO8601:¹æ¶¨µÚÒ»¸öÐÇÆÚËÄΪµÚÒ»ÖÜ,ĬÈÏÖµ<br />
|
2. MSExcel:1ÔÂ1ÈÕËùÔÚµÄÖÜ</p>
|
</div>
|
<div>
|
<h4>ʾÀý1-2-2 ÀûÓÃonpickedʼþ°ÑÖܸ³Öµ¸øÁíÍâµÄÎı¾¿ò</h4>
|
<p>
|
<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" id="d122_1" size="3"/>
|
(W¸ñʽ)ÖÜ, ÁíÍâÄú¿ÉÒÔʹÓÃWW¸ñʽ:
|
<input type="text" id="d122_2" size="3"/>
|
ÖÜ <br />
|
<input type="text" class="Wdate" id="d122" onFocus="WdatePicker({<span class="STYLE2">isShowWeek:</span><span class="STYLE1">true</span>,<span class="STYLE2">onpicked:</span><span class="STYLE1">function() {$dp.$('d122_1').value=$dp.cal.getP('W','W');$dp.$('d122_2').value=$dp.cal.getP('W','WW');}</span>})"/><br />
|
<br />
|
onpicked Ó÷¨Ïê¼û<a href="2.5.asp.htm#m251" tppabs="http://www.my97.net/dp/demo/resource/2.5.asp#m251">×Ô¶¨Òåʼþ</a><br />
|
$dp.cal.getP Ó÷¨Ïê¼û<a href="999.asp.htm#m5" tppabs="http://www.my97.net/dp/demo/resource/999.asp#m5">ÄÚÖú¯ÊýºÍÊôÐÔ</a><br />
|
</p>
|
</div>
|
</li>
|
<li>Ö»¶Á¿ª¹Ø,¸ßÁÁÖÜÄ©¹¦ÄÜ <a name="m214" id="m214"></a>
|
<p>ÉèÖÃreadOnlyÊôÐÔ true »ò false ¿ÉÖ¸¶¨ÈÕÆÚ¿òÊÇ·ñÖ»¶Á <br />
|
ÉèÖÃhighLineWeekDayÊôÐÔ ture »ò false ¿ÉÖ¸¶¨ÊÇ·ñ¸ßÁÁÖÜÄ© </p>
|
</li>
|
<li>²Ù×÷°´Å¥×Ô¶¨Òå <a name="m215" id="m215"></a>
|
<p>Çå¿Õ°´Å¥ºÍ½ñÌì°´Å¥,¿ÉÒÔ¸ù¾ÝÐèÒª½øÐÐ×Ô¶¨Òå,ËüÃÇ·Ö±ð¶ÔÓ¦ isShowClear ºÍ isShowToday ĬÈÏÖµ¶¼ÊÇtrue</p>
|
<div>
|
<h4>ʾÀý1-5 ½ûÓÃÇå¿Õ¹¦ÄÜ</h4>
|
<p> ×îºÃ°ÑreadOnlyÖÃΪtrue,·ñÔò¼´Ê¹Òþ²ØÁËÇå¿Õ°´Å¥,Óû§ÒÀÈ»¿ÉÒÔÔÚÊäÈë¿òÀï°ÑÖµdeleteµô<br />
|
<input class="Wdate" type="text" id="d15" onFocus="WdatePicker({isShowClear:false,readOnly:true})"/>
|
<br />
|
<input class="Wdate" type="text" id="d15" onFocus="WdatePicker({<span class="STYLE2">isShowClear:</span><span class="STYLE1">false</span>,<span class="STYLE2">readOnly:</span><span class="STYLE1">true</span>})"/></p>
|
</div>
|
</li>
|
<li>×Ô¶¯Ñ¡ÔñÏÔʾλÖÃ<a name="m216" id="m216"></a>
|
<p>µ±¿Ø¼þ´¦ÔÚÒ³Ãæ±ß½çʱ,Ëü»á×Ô¶¯Ñ¡ÔñÏÔʾµÄλÖÃ,ËùÒÔûÓбØÒªµ£Ðĵ¯³ö¿ò»á±»Ò³Ãæ±ß½çÕÚסµÄÎÊÌâÁË.</p>
|
</li>
|
<li>×Ô¶¨Ò嵯³öλÖà <a name="m217" id="m217"></a>
|
<p>µ±¿Ø¼þ´¦ÔÚÒ³Ãæ±ß½çʱ,Ëü»á×Ô¶¯Ñ¡ÔñÏÔʾµÄλÖÃ.´ËÍâÄ㻹¿ÉÒÔʹÓÃposition²ÎÊý¶Ôµ¯³öλÖÃ×öµ÷Õû.</p>
|
<br />
|
<div>
|
<h4>ʾÀý1-6 ͨ¹ýpositionÊôÐÔ,×Ô¶¨Ò嵯³öλÖÃ</h4>
|
<p>ʹÓÃpositonÊôÐÔÖ¸¶¨,µ¯³öÈÕÆÚµÄ×ø±êΪ{left:100,top:50}<br />
|
<input class="Wdate" type="text" id="d16" onfocus="WdatePicker({position:{left:100,top:50}})"/>
|
<br />
|
<input class="Wdate" type="text" id="d16" onfocus="WdatePicker({<span class="STYLE2">position:</span><span class="STYLE1">{left:100,top:50}</span>})"/><br />
|
<br />
|
positionÊôÐÔµÄÏêϸÓ÷¨Ïê¼û<a href="3.asp.htm#m31" tppabs="http://www.my97.net/dp/demo/resource/3.asp#m31">ÊôÐÔ±í</a></p>
|
</div>
|
</li>
|
<li>×Ô¶¨ÒåÐÇÆڵĵÚÒ»Ìì<span class="STYLE1">(4.6ÐÂÔö)</span><a name="m218" id="m218"></a>
|
<p>¸÷¸ö¹ú¼ÒµÄÏ°¹ß²»Í¬,ÓÐЩϲ»¶ÒÔÐÇÆÚÈÕ×÷ΪµÚÒ»Ìì,ÓÐЩÒÔÐÇÆÚÒ»×÷ΪµÚÒ»Ìì.<br />
|
Ïà¹ØÊôÐÔ:<span class="STYLE2">firstDayOfWeek</span>: ¿ÉÉèÖà 0 - 6 µÄÈÎÒâÒ»¸öÊý×Ö,0:ÐÇÆÚÈÕ 1:ÐÇÆÚÒ» ÒÔ´ËÀàÍÆ</p>
|
<div>
|
<h4>ʾÀý1-7 ÒÔÐÇÆÚÒ»×÷ΪµÚÒ»Ìì</h4>
|
<p>
|
<input class="Wdate" type="text" id="d17" onfocus="WdatePicker({firstDayOfWeek:1})"/>
|
<br />
|
<input class="Wdate" type="text" id="d17" onfocus="WdatePicker({<span class="STYLE2">firstDayOfWeek:</span><span class="STYLE1">1</span>})"/><br />
|
</p>
|
</div>
|
</li>
|
</ol>
|
<h3><a href="2.2.asp.htm" tppabs="http://www.my97.net/dp/demo/resource/2.2.asp">2. ÌØÉ«¹¦ÄÜ</a> <a name="m22" id="m22"></a></h3>
|
<h3><a href="2.3.asp.htm" tppabs="http://www.my97.net/dp/demo/resource/2.3.asp">3. ¶àÓïÑÔºÍ×Ô¶¨ÒåƤ·ô</a><a name="m23" id="m23"></a></h3>
|
<h3><a href="2.4.asp.htm" tppabs="http://www.my97.net/dp/demo/resource/2.4.asp">4. ÈÕÆÚ·¶Î§ÏÞÖÆ</a><a name="m24" id="m24"></a></h3>
|
<h3><a href="2.5.asp.htm" tppabs="http://www.my97.net/dp/demo/resource/2.5.asp">5. ×Ô¶¨Òåʼþ</a><a name="m25" id="m25"></a></h3>
|
<h3><a href="2.6.asp.htm" tppabs="http://www.my97.net/dp/demo/resource/2.6.asp">6. ¿ìËÙÑ¡Ôñ¹¦ÄÜ</a> <a name="m26" id="m26"></a></h3>
|
<h2><a href="3.asp.htm" tppabs="http://www.my97.net/dp/demo/resource/3.asp">Èý. ÅäÖÃ˵Ã÷</a><a name="m3" id="m3"></a></h2>
|
<h2><a href="999.asp.htm" tppabs="http://www.my97.net/dp/demo/resource/999.asp">ËÄ. ÈçºÎʹÓÃ</a><a name="m4" id="m4"></a></h2>
|
<br />
|
<br />
|
</div>
|
<div style="clear:both"></div>
|
</div>
|
<div class="dCenter dBody" style="padding-left:72px">
|
<script type="text/javascript"><!--
|
google_ad_client = "ca-pub-6343250634002651";
|
/* µ×²¿ */
|
google_ad_slot = "0599809152";
|
google_ad_width = 728;
|
google_ad_height = 90;
|
//-->
|
</script>
|
<script type="text/javascript">
|
</script>
|
</div>
|
<div id="footer" class="dCenter">© 2010 <a href="mailto:smallcarrot@163.com">My97</a> All Rights Reserved. <script type="text/javascript">
|
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
|
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3F489957c212e14340592fb2e4921b2f1d' type='text/javascript'%3E%3C/script%3E"));
|
</script> ÕãICP±¸11060275ºÅ
|
</div>
|
</body>
|
</html>
|
