¶þ. ¹¦Äܼ°Ê¾Àý

2. ÌØÉ«¹¦ÄÜ

1. ƽÃæÏÔʾ

   ÈÕÆڿؼþÖ§³ÖƽÃæÏÔʾ¹¦ÄÜ,Ö»ÒªÉèÖÃÒ»ÏÂeContÊôÐԾͿÉÒÔ°ÑËüµ±×÷ÈÕÀúÀ´Ê¹ÓÃÁË,ÎÞÐè´¥·¢Ìõ¼þ,Ö±½ÓÏÔʾÔÚÒ³ÃæÉÏ

   
   

   ʾÀý2-1 ƽÃæÏÔʾÑÝʾ

   <div id="div1"></div>
   <script>
   WdatePicker({eCont:'div1',onpicked:function(dp){alert('ÄãÑ¡ÔñµÄÈÕÆÚÊÇ:'+dp.cal.getDateStr())}})
   </script>
   
   $dp.cal.getDateStr Ó÷¨Ïê¼ûÄÚÖú¯ÊýºÍÊôÐÔ

2. Ö§³Ö¶àÖÖÈÝÆ÷

   ³ýÁË¿ÉÒÔ½«Öµ·µ»Ø¸øinputÒÔÍâ,»¹¿ÉÒÔͨ¹ýÅäÖÃelÊôÐÔ½«Öµ·µ»Ø¸øÆäËûµÄÔªËØ(Èç:textarea,div,span)µÈ,´øÓÐinnerHTMLÊôÐÔµÄHTMLÔªËØ

   ʾÀý2-2 ½«ÈÕÆÚ·µ»Øµ½<span>ÖÐ

   2008-01-01
   
   ´úÂë:
   <span id="demospan">2008-01-01</span>
   <img onClick="WdatePicker({el:'demospan'})" src="../../../skin/datePicker.gif" width="16" height="22" align="absmiddle" style="cursor:pointer" />

3. ÆðʼÈÕÆÚ¹¦ÄÜ
   ×¢Òâ:ÈÕÆÚ¸ñʽ±ØÐëÓë realDateFmt ºÍ realTimeFmt Ò»Ö¶ø²»ÊÇÓë dateFmt Ò»ÖÂ

   ÓÐʱÔÚÏîÄ¿ÖÐÐèҪѡÔñÉúÈÕÖ®ÀàµÄÈÕÆÚ,¶øĬÈϵ㿪ʼÈÕÆÚ¶¼Êǵ±Ç°ÈÕÆÚ,µ¼ÖÂÄê·ÝÑ¡Ôñ·Ç³£Âé·³,Äã¿ÉÒÔͨ¹ýÆðʼÈÕÆÚ¹¦ÄܼÓÉÏÅäÖÃalwaysUseStartDateÊôÐÔÇáËɽâ¾ö´ËÀàÎÊÌâ

   ʾÀý2-3-1 ÆðʼÈÕÆÚ¼òµ¥Ó¦ÓÃ

   ĬÈϵÄÆðʼÈÕÆÚΪ 1980-05-01
   µ±ÈÕÆÚ¿òΪ¿Õֵʱ,½«Ê¹Óà 1980-05-01 ×öΪÆðʼÈÕÆÚ
   
   
   <input type="text" id="d221" onFocus="WdatePicker({startDate:'1980-05-01'})"/>

   ʾÀý2-3-2 alwaysUseStartDateÊôÐÔÓ¦ÓÃ

   ĬÈϵÄÆðʼÈÕÆÚΪ 1980-05-01
   µ±ÈÕÆÚ¿òÎÞÂÛÊǺÎÖµ,ʼÖÕʹÓà 1980-05-01 ×öΪÆðʼÈÕÆÚ
   
   
   <input type="text" id="d222" onFocus="WdatePicker({startDate:'1980-05-01',alwaysUseStartDate:true})"/>

   ʾÀý2-3-3 ʹÓÃÄÚÖòÎÊý

   ³ýÁËʹÓþ²Ì¬µÄÈÕÆÚÖµÒÔÍâ,»¹¿ÉÒÔʹÓö¯Ì¬²ÎÊý(Èç:%y,%M·Ö±ð±íʾµ±Ç°ÄêºÍÔÂ)
   
   ÏÂÀýÑÝʾ,ÄêÔÂÈÕʹÓõ±Äêµ±ÔµÄ1ÈÕ,ʱ·ÖÃëʹÓÃ00:00:00×÷ΪÆðʼʱ¼ä
   
   
   <input type="text" id="d233" onFocus="WdatePicker({startDate:'%y-%M-01 00:00:00',dateFmt:'yyyy-MM-dd HH:mm:ss',alwaysUseStartDate:true})"/>

4. ×Ô¶¨Òå¸ñʽ

   yMdHmswW·Ö±ð´ú±íÄêÔÂÈÕʱ·ÖÃëÐÇÆÚÖÜ,Äã¿ÉÒÔÈÎÒâ×éºÏÕâЩԪËØÀ´×Ô¶¨ÒåÄã¸öÐÔ»¯µÄÈÕÆÚ¸ñʽ.

   
   ÈÕÆÚ¸ñʽ±í

   ¸ñʽ	˵Ã÷
   y	½«Äê·Ý±íʾΪ×î¶àÁ½Î»Êý×Ö¡£Èç¹ûÄê·Ý¶àÓÚÁ½Î»Êý£¬Ôò½á¹ûÖнöÏÔʾÁ½Î»µÍλÊý¡£
   yy	ͬÉÏ£¬Èç¹ûСÓÚÁ½Î»Êý£¬Ç°Ãæ²¹Áã¡£
   yyy	½«Äê·Ý±íʾΪÈýλÊý×Ö¡£Èç¹ûÉÙÓÚÈýλÊý£¬Ç°Ãæ²¹Áã¡£
   yyyy	½«Äê·Ý±íʾΪËÄλÊý×Ö¡£Èç¹ûÉÙÓÚËÄλÊý£¬Ç°Ãæ²¹Áã¡£
   M	½«Ô·ݱíʾΪ´Ó 1 ÖÁ 12 µÄÊý×Ö
   MM	ͬÉÏ£¬Èç¹ûСÓÚÁ½Î»Êý£¬Ç°Ãæ²¹Áã¡£
   MMM	·µ»ØÔ·ݵÄËõд Ò»Ô ÖÁ Ê®¶þÔ (Ó¢ÎÄ״̬Ï Jan to Dec) ¡£
   MMMM	·µ»ØÔ·ݵÄÈ«³Æ Ò»Ô ÖÁ Ê®¶þÔ (Ó¢ÎÄ״̬Ï January to December) ¡£
   d	½«ÔÂÖÐÈÕÆÚ±íʾΪ´Ó 1 ÖÁ 31 µÄÊý×Ö¡£
   dd	ͬÉÏ£¬Èç¹ûСÓÚÁ½Î»Êý£¬Ç°Ãæ²¹Áã¡£
   H	½«Ð¡Ê±±íʾΪ´Ó 0 ÖÁ 23 µÄÊý×Ö¡£
   HH	ͬÉÏ£¬Èç¹ûСÓÚÁ½Î»Êý£¬Ç°Ãæ²¹Áã¡£
   m	½«·ÖÖÓ±íʾΪ´Ó 0 ÖÁ 59 µÄÊý×Ö¡£
   mm	ͬÉÏ£¬Èç¹ûСÓÚÁ½Î»Êý£¬Ç°Ãæ²¹Áã¡£
   s	½«Ãë±íʾΪ´Ó 0 ÖÁ 59 µÄÊý×Ö¡£
   ss	ͬÉÏ£¬Èç¹ûСÓÚÁ½Î»Êý£¬Ç°Ãæ²¹Áã¡£
   w	·µ»ØÐÇÆÚ¶ÔÓ¦µÄÊý×Ö 0 (ÐÇÆÚÌì) - 6 (ÐÇÆÚÁù) ¡£
   D	·µ»ØÐÇÆÚµÄËõд Ò» ÖÁ Áù (Ó¢ÎÄ״̬Ï Sun to Sat) ¡£
   DD	·µ»ØÐÇÆÚµÄÈ«³Æ ÐÇÆÚÒ» ÖÁ ÐÇÆÚÁù (Ó¢ÎÄ״̬Ï Sunday to Saturday) ¡£
   W	·µ»ØÖܶÔÓ¦µÄÊý×Ö (1 - 53) ¡£
   WW	ͬÉÏ£¬Èç¹ûСÓÚÁ½Î»Êý£¬Ç°Ãæ²¹Áã (01 - 53) ¡£

   
   ʾÀý
   

   ¸ñʽ×Ö·û´®	Öµ
   yyyy-MM-dd HH:mm:ss	2008-03-12 19:20:00
   yyÄêMÔÂ	08Äê3ÔÂ
   yyyyMMdd	20080312
   ½ñÌìÊÇ:yyyyÄêMÄêd HHʱmm·Ö	½ñÌìÊÇ:2008Äê3ÔÂ12ÈÕ 19ʱ20·Ö
   H:m:s	19:20:0
   yÄê	8Äê
   MMMM d, yyyy	ÈýÔÂ 12, 2008

   ʾÀý 2-4-1: ÄêÔÂÈÕʱ·ÖÃë

   
   <input type="text" id="d241" onfocus="WdatePicker({dateFmt:'yyyyÄêMMÔÂddÈÕ HHʱmm·ÖssÃë'})" class="Wdate" style="width:300px"/>
   
   ×¢Òâ:µãÁ½´Î²ÅÄÜÑ¡ÔñÈÕÆÚµÄÔ­Òò,Ïê¼û autoPickDate ÊôÐÔ

   ʾÀý 2-4-2 ʱ·ÖÃë

   
   <input type="text" id="d242" onfocus="WdatePicker({skin:'whyGreen',dateFmt:'H:mm:ss'})" class="Wdate"/>
   
   ×¢Òâ:ÕâÀïÌáǰʹÓÃÁËƤ·ô(skin)ÊôÐÔ,ËùÒÔÄã»á¿´µ½Ò»¸ö²»Í¬µÄƤ·ô,Ƥ·ôÊôÐÔÏê¼û×Ô¶¨ÒåºÍ¶¯Ì¬Çл»Æ¤·ô

   ʾÀý 2-4-3 ÄêÔÂ

   
   <input type="text" id="d243" onfocus="WdatePicker({skin:'whyGreen',dateFmt:'yyyyÄêMMÔÂ'})" class="Wdate"/>

   ʾÀý 2-4-4 È¡µÃϵͳ¿Éʶ±ðµÄÈÕÆÚÖµ(ÖØÒª)

   ÀàËÆÓÚ 1999Äê7ÔÂ5ÈÕ ÕâÑùµÄÈÕÆÚÊDz»Äܹ»±»ÏµÍ³Ê¶±ðµÄ,Ëû±ØÐëת»»ÎªÄܹ»Ê¶±ðµÄÀàÐÍÈç 1999-07-05
   
   ÕæʵµÄÈÕÆÚÖµÊÇ:
   <input id="d244" type="text" class="Wdate" onfocus="WdatePicker({dateFmt:'yyyyÄêMÔÂdÈÕ',vel:'d244_2'})"/>
   <input id="d244_2" type="text" />
   
   ×¢Òâ:ÔÚʵ¼ÊÓ¦ÓÃÖÐ,Ò»°ã»á°ÑvelÖ¸¶¨ÎªÒ»¸öhidden¿Ø¼þ,ÕâÀïÊÇΪÁË°ÑÕæʵֵչʾ³öÀ´,ËùÒÔʹÓÃÎı¾¿ò
   ¹Ø¼üÊôÐÔ: vel Ö¸¶¨Ò»¸ö¿Ø¼þ»ò¿Ø¼þµÄID,±ØÐë¾ßÓÐvalueÊôÐÔ(Èçinput),ÓÃÓÚ´æ´¢Õæʵֵ(Ò²¾ÍÊÇrealDateFmtºÍrealTimeFmt¸ñʽ»¯ºóµÄÖµ)

   ʾÀý 2-4-5 ÐÇÆÚ, Ô ÈÕ, Äê(4.6ÐÂÔö)

   
   <input type="text" id="d245" onfocus="WdatePicker({dateFmt:'DD, MMMM d, yyyy'})" class="Wdate"/>

5. Ë«ÔÂÈÕÀú¹¦ÄÜ(4.6ÐÂÔö)

   ¿ÉÒÔͬʱµ¯³öÁ½¸öÔµÄÈÕÀú

   ʾÀý2-5 Ë«ÔÂÈÕÀú¹¦ÄÜ

   
   <input class="Wdate" type="text" onfocus="WdatePicker({doubleCalendar:true,dateFmt:'yyyy-MM-dd'})"/>
   
   ×¢Òâ:Ë«ÔÂÈÕÀúÒ»°ãÖ»ÓÃÓÚ°üº¬ÄêÔÂÈÕÈý¸öÔªËصij¡¾°,ÁíÍâÉèÖøÃÊôÐÔʱ,autoPickDate×Ô¶¯ÉèÖÃΪtrue

6. ×Ô¶¯¾À´í¹¦ÄÜ

   ¾À´í´¦Àí¿ÉÉèÖÃΪ3ÖÖģʽ:Ìáʾ(ĬÈÏ) ×Ô¶¯¾À´í ±ê¼Ç,µ±ÈÕÆÚ¿òÖеÄÖµ²»·ûºÏ¸ñʽʱ,ϵͳ»á³¢ÊÔ×Ô¶¯ÐÞ¸´,Èç¹ûÐÞ¸´Ê§°Ü»á¸ù¾ÝÄúÉèÖõľÀ´í´¦Àíģʽ½øÐд¦Àí,´íÎóÅжϹ¦Äܷdz£ÖÇÄÜËü¿ÉÒÔ±£Ö¤Óû§ÊäÈëµÄÖµÊÇÒ»¸öºÏ·¨µÄÖµ

   ʾÀý2-6-1 ²»ºÏ·¨µÄÈÕÆÚÑÝʾ

   ÇëÔÚÏÂÃæµÄÈÕÆÚ¿òÖÐÌîÈëÒ»¸ö²»ºÏ·¨µÄÈÕÆÚ(Èç:1997-02-29),ÔÙ³¢ÊÔÀ뿪½¹µã
   ʹÓÃĬÈÏÈÝ´íģʽ Ìáʾģʽ errDealMode = 0 ÔÚÊäÈë´íÎóÈÕÆÚʱ,»áÏÈÌáʾ
   
   
   ×¢Òâ:1997Äê²»ÊÇÈòÄêŶ

   ʾÀý2-6-2 ³¬³öÈÕÆÚÏÞÖÆ·¶Î§µÄÈÕÆÚÒ²±»ÈÏΪÊÇÒ»¸ö²»ºÏ·¨µÄÈÕÆÚ

   ×î´óÈÕÆÚÊÇ2000-01-10 ,Èç¹ûÔÚÏ¿òÖÐÌîÈëµÄÈÕÆÚ ´óÓÚ 2000-01-10(Èç2000-01-12)Ò²»á±»ÈÏΪÊDz»ºÏ·¨µÄÈÕÆÚ
   ×Ô¶¯¾À´íģʽ errDealMode = 1 ÔÚÊäÈë´íÎóÈÕÆÚʱ,×Ô¶¯»Ö¸´Ç°Ò»´ÎÕýÈ·µÄÖµ
   

   ʾÀý2-6-3 ʹÓÃÎÞЧÌìºÍÎÞЧÈÕÆÚ¹¦ÄÜÏÞÖƵÄÈÕÆÚÒ²±»ÈÏΪÊÇÒ»¸ö²»ºÏ·¨µÄÈÕÆÚ

   Èç:
   2008-02-20 ÎÞЧÈÕÆÚÏÞÖÆ
   2008-02-02 2008-02-09 2008-02-16 2008-02-23 ÎÞЧÌìÏÞÖÆ
   ¶¼ÊÇÎÞЧÈÕÆÚ
   Äú¿ÉÒÔ³¢ÊÔÔÚÏ¿òÖÐÊäÈëÕâЩÈÕÆÚ,²¢À뿪½¹µã
   
   ±ê¼Çģʽ errDealMode = 2 ÔÚÊäÈë´íÎóÈÕÆÚʱ,²»×öÌáʾºÍ¸ü¸Ä,Ö»ÊÇ×öÒ»¸ö±ê¼Ç,µ«´ËʱÈÕÆÚ¿ò²»»áÂíÉÏÒþ²Ø
   
   
   ×¢Òâ:±ê¼ÇÀà:WdateFmtErrÊÇÔÚskinĿ¼ÏÂWdatePicker.cssÖж¨ÒåµÄ

7. ¿çÎÞÏÞ¼¶¿ò¼ÜÏÔʾ

   ÎÞÂÛÄã°ÑÈÕÆڿؼþ·ÅÔÚÄÄÀï,Ä㶼²»ÐèÒªµ£ÐĻᱻÍâ²ãµÄiframeËùÕÚµ²½ø¶øÓ°Ïì¿Í»§ÌåÑé,ÒòΪMy97ÈÕÆڿؼþÊÇ¿ÉÒÔ¿çÎÞÏÞ¼¶¿ò¼ÜÏÔʾµÄ

   ʾÀý2-7 ¿çÎÞÏÞ¼¶¿ò¼ÜÑÝʾ

   ¿ÉÎÞÏÞ¿çÔ½¿ò¼Üiframe,ÎÞÂÛÔõôǶÌ׿ò¼Ü¶¼²»±Øµ£ÐÄÁË,¼´Ê¹Óйö¶¯ÌõÒ²²»ÅÂ
   ×¢Òâ:JavascriptÊÇÎÞ·¨¿çÔ½framesetµÄ,µ«ÊÇMy97ÈÕÆڿؼþ¿ÉÎÞÏÞ¿çÔ½¿ò¼Üiframe,ÈκεÄframeset¶¼¿ÉÒÔʹÓÃiframe´úÌæ

8. Ãñ¹úÄêÈÕÀúºÍÆäËûÌØÊâÈÕÀú

   µ±Äê·Ý¸ñʽÉèÖÃΪyyy¸ñʽʱ,ÀûÓÃÄê·Ý²îÁ¿ÊôÐÔyearOffset(ĬÈÏÖµ1911Ãñ¹úÔªÄê),¿ÉʵÏÖÃñ¹úÄêÈÕÀúºÍÆäËûÌØÊâÈÕÀú

   ʾÀý2-8 Ãñ¹úÄêÑÝʾ

   
   <input type="text" id="d28" onClick="WdatePicker({dateFmt:'yyy/MM/dd'})"/>
   
   ×¢Òâ:Äê·Ý¸ñʽÉèÖóÉyyyʱ,ÕæÕýµÄÈÕÆÚ½«»á¼õÈ¥Ò»¸ö²îÁ¿yearOffset(ĬÈÏֵΪ:1911),Èç¹ûÊÇÃñ¹úÄêʹÓÃĬÈÏÖµ¼´¿ÉÎÞÐèÁíÍâÅäÖÃ,Èç¹ûÊÇÆäËûµÄ²îÁ¿,¿ÉÒÔͨ¹ý²ÎÊýµÄÐÎʽÅäÖÃ

9. ±à¼­¹¦ÄÜ

   µ±ÈÕÆÚ¿òÀïÃæÓÐֵʱ,ÐÞ¸ÄÍêij¸öÊôÐÔºó,Ö»Òªµã»÷Õâ¸ö°´Å¥¾Í¿ÉÒÔʵÏÖʱ¼äºÍÈÕÆڵı༭

   ʾÀý2-9 ÈÕÆÚºÍʱ¼äµÄ±à¼­ÑÝʾ

   Äú¿ÉÒÔ³¢ÊÔ¶ÔÏÂÃæ¿òÖеÄÔ·ݸÄΪ1,È»ºóµã»÷¸üÐÂ,Äã»á·¢ÏÖÈÕÆÚÓÉ 2000-02-29 01:00:00 ±äΪ 2000-01-29 01:00:00
   

10. Ϊ±à³Ì´øÀ´·½±ã

    Èç¹ûelµÄÖµÊÇthis,¿ÉÊ¡ÂÔ,¼´ËùÓеÄel:this¶¼¿ÉÒÔ²»Ð´
    ÈÕÆÚ¿òÉèÖÃΪdisabledʱ,½ûÖ¹¸ü¸ÄÈÕÆÚ(²»µ¯³öÑ¡Ôñ¿ò)
    Èç¹ûûÓж¨Òåonpickedʼþ,×Ô¶¯´¥·¢Îı¾¿òµÄonchangeʼþ
    Èç¹ûûÓж¨Òåonclearedʼþ,Çå¿Õʱ,×Ô¶¯´¥·¢onchangeʼþ

11. ÆäËûÊôÐÔ

    ÉèÖÃreadOnlyÊôÐÔ,¿ÉÖ¸¶¨ÈÕÆÚ¿òÊÇ·ñÖ»¶Á
    ÉèÖÃhighLineWeekDayÊôÐÔ,¿ÉÖ¸¶¨ÊÇ·ñ¸ßÁÁÖÜÄ©
    ÉèÖÃisShowOthersÊôÐÔ,¿ÉÖ¸¶¨ÊÇ·ñÏÔʾÆäËûÔµÄÈÕÆÚ
    ¼ÓÉÏclass="Wdate"¾Í»áÔÚÑ¡Ôñ¿òÓұ߳öÏÖÈÕÆÚͼ±ê

3. ¶àÓïÑÔºÍ×Ô¶¨ÒåƤ·ô

4. ÈÕÆÚ·¶Î§ÏÞÖÆ

5. ×Ô¶¨Òåʼþ

6. ¿ìËÙÑ¡Ôñ¹¦ÄÜ

Èý. ÅäÖÃ˵Ã÷

ËÄ. ÈçºÎʹÓÃ