Jquery控制My97DatePicker控件的日期格式

最近的项目,要取时间段进行统计,按照年月日时等方法,取按年统计的时候,我们希望时间控件只能选择年,按照月统计时候,我们希望只能选择年月这两项,因此写了这个小程序。
firefox测试可用。
Java代码 复制代码  收藏代码
  1. <html>   
  2.     <head>   
  3.         <title>   
  4.             测试jquery控制My97DatetimePicker格式   
  5.         </title>   
  6.         <script type="text/javascript" src="WdatePicker.js"></script>   
  7.         <script type="text/javascript" src="jquery-1.4.2.min.js"></script>   
  8.     </head>   
  9.     <body>   
  10.     <script type="text/javascript" >   
  11.     $(document).ready(function(){   
  12.     $('.time').bind('focus',function(){WdatePicker()});   
  13.     });   
  14.     function changeAttr1(){   
  15.         $('#start').unbind('focus');   
  16.         $('#start').bind('focus',function(){WdatePicker({skin:'whyGreen',dateFmt:'yyyy'});});   
  17.         $('#end').unbind('focus');   
  18.         $('#end').bind('focus',function(){WdatePicker({skin:'whyGreen',dateFmt:'yyyy',minDate:'#F{$dp.$D(\'start\')}'});});   
  19.     }   
  20.     function changeAttr2(){   
  21.     $('#start').unbind('focus');   
  22.         $('#start').bind('focus',function(){WdatePicker({skin:'whyGreen',dateFmt:'yyyy年MM月'});});   
  23.     $('#end').unbind('focus')   
  24.         $('#end').bind('focus',function(){WdatePicker({skin:'whyGreen',dateFmt:'yyyy年MM月',minDate:'#F{$dp.$D(\'start\')}'});});   
  25.     }   
  26.     function changeAttr3(){   
  27.     $('#start').unbind('focus');   
  28.         $('#start').bind('focus',function(){WdatePicker({skin:'whyGreen',dateFmt:'yyyy年M月d日'});});   
  29.     $('#end').unbind('focus');   
  30.         $('#end').bind('focus',function(){WdatePicker({skin:'whyGreen',dateFmt:'yyyy年M月d日',minDate:'#F{$dp.$D(\'start\')}'});});   
  31.     }   
  32.     function changeAttr4(){   
  33.     $('#start').unbind('focus');   
  34.         $('#start').bind('focus',function(){WdatePicker({skin:'whyGreen',dateFmt:'yyyy年M月d日 HH时'});});   
  35.     $('#end').unbind('focus');   
  36.         $('#end').bind('focus',function(){WdatePicker({skin:'whyGreen',dateFmt:'yyyy年M月d日 HH时',minDate:'#F{$dp.$D(\'start\')}'});});   
  37.     }   
  38.   
  39.     </script>   
  40.     <input id="start" class="time" type="text"/>   
  41.     <input id="end" class="time" type="text"/>   
  42.     <input id="1" type="button" value="变为年" onclick="changeAttr1()">   
  43.     <input id="2" type="button" value="变为月" onclick="changeAttr2()">   
  44.     <input id="3" type="button" value="变为日" onclick="changeAttr3()">   
  45.     <input id="4" type="button" value="变为时" onclick="changeAttr4()">   
  46.     </body>   
  47. </html>  

效果图:
Jquery控制My97DatePicker控件的日期格式_第1张图片

Jquery控制My97DatePicker控件的日期格式_第2张图片

Jquery控制My97DatePicker控件的日期格式_第3张图片

Jquery控制My97DatePicker控件的日期格式_第4张图片
  • Jquery控制My97DatePicker控件的日期格式_第5张图片
  • 大小: 35.5 KB
  • Jquery控制My97DatePicker控件的日期格式_第6张图片
  • 大小: 37.7 KB
  • Jquery控制My97DatePicker控件的日期格式_第7张图片
  • 大小: 50.5 KB
  • Jquery控制My97DatePicker控件的日期格式_第8张图片
  • 大小: 47.8 KB
  • 查看图片附件

你可能感兴趣的:(jquery,function,测试,input,firefox,button)