时间选择器

标签：

<span id="ComInvCircleType_" style="margin-left:20px;">     
　　<span id="year_02" class="circle-item" code="year">年</span>     
　　<span class="circle-item-separator"></span>     
　　<span id="season_02" class="circle-item" code="season">季</span>     
　　<span class="circle-item-separator"></span>     
　　<span id="month_02" class="circle-item" code="month">月</span>     
　　<span class="circle-item-separator"></span>     
　　<span id="week_02" class="circle-item" code="week">周</span>     
　　<span class="circle-item-separator"></span>     
　　<span id="day_02" class="circle-item" code="day">日</span>     
　　<span class="circle-item-separator"></span> 
</span>

<span id="Compare-circle-selected">     
　　<span code="year">
　　　　<select  name="CompareYear"></select>年
　　</span>     
　　<span  code="season">         
　　　　<select  name="CompareSeason">             
　　　　　　<option  value="1" >1 </option>             
　　　　　　<option  value="2">2</option>             
　　　　　　<option  value="3">3</option>             
　　　　　　<option  value="4">4</option>         
　　　　</select>季     
　　</span>     
<span  code="month">         
　　<select  name="CompareMonth">             
　　　　<option  value="01">01</option>             
　　　　<option  value="02">02</option>             
　　　　<option  value="03">03</option>             
　　　　<option  value="04">04</option>             
　　　　<option  value="05" >05 </option>             
　　　　<option  value="06">06</option>             
　　　　<option  value="07">07</option>             
　　　　<option  value="08">08</option>             
　　　　<option  value="09" >09 </option>             
　　　　<option  value="10">10</option>          
  　　 <option  value="11">11</option>       
  　　 <option  value="12">12</option>         
　　</select>月     
</span>     
<span code="week">         
　　<select  name="CompareWeek">             
　　　　<option value="1" >1</option>             
　　　　<option value="2">2</option>             
　　　　<option value="3">3</option>             
　　　　<option value="4">4</option>             
　　　　<option value="5">5</option>         
　　</select>周     
</span>     
<span code="day">         
　　<select  name="CompareDay">
　　</select>日
</span> 
</span>

initEvent:function(){     
var me=this;     
$("#Compare-circle-selected span[code=‘year‘] select[name=‘CompareYear‘]").bind("change",function(){         
　　　　var year=$("#Compare-circle-selected span[code=‘year‘] select[name=‘CompareYear‘]").val();         
　　　　var month=$("#Compare-circle-selected span[code=‘month‘] select[name=‘CompareMonth‘]").val();        
　　　　 me.initDay(year,month);    
 });     
$("#Compare-circle-selected span[code=‘month‘] select[name=‘CompareMonth‘]").bind("change",function(){
         var year=$("#Compare-circle-selected span[code=‘year‘] select[name=‘CompareYear‘]").val();
         var month=$("#Compare-circle-selected span[code=‘month‘] select[name=‘CompareMonth‘]").val();
         me.initDay(year,month);
     });
},

initDay:function(year,month){
     var date=new Date(year,month-1);
     var days=date.getDaysOfMonth();
     $("#Compare-circle-selected span[code=‘day‘] select[name=‘CompareDay‘]").html("");
     for(var i=1;i<=days;i++){
         var dayStr=i;
         if(i<10){
             dayStr="0"+i;
         }
         $("#Compare-circle-selected span[code=‘day‘] select[name=‘CompareDay‘]").append("<option value=‘"+dayStr+"‘>"+dayStr+"</option>")     
　　}
 },

circleTypeSelectedTwo:function(code){
     $(".circle-item").removeClass("circle-item-selected");
     $(".circle-item[code=‘"+code+"‘]").addClass("circle-item-selected");
     switch (code){
         case "year":
             $("#Compare-circle-selected>span[code=‘season‘]").css("display","none");
             $("#Compare-circle-selected>span[code=‘month‘]").css("display","none");
             $("#Compare-circle-selected >span[code=‘week‘]").css("display","none");
             $("#Compare-circle-selected >span[code=‘day‘]").css("display","none");
             break;
         case "season":
             $("#Compare-circle-selected >span[code=‘season‘]").css("display","inline-block");
             $("#Compare-circle-selected >span[code=‘month‘]").css("display","none");
             $("#Compare-circle-selected >span[code=‘week‘]").css("display","none");
             $("#Compare-circle-selected >span[code=‘day‘]").css("display","none");
             break;
         case "month":
             $("#Compare-circle-selected >span[code=‘season‘]").css("display","none");
             $("#Compare-circle-selected >span[code=‘month‘]").css("display","inline-block");
             $("#Compare-circle-selected >span[code=‘week‘]").css("display","none"); 
            $("#Compare-circle-selected >span[code=‘day‘]").css("display","none");
             break;
         case "week":
             $("#Compare-circle-selected>span[code=‘season‘]").css("display","none");
             $("#Compare-circle-selected >span[code=‘month‘]").css("display","inline-block");
             $("#Compare-circle-selected >span[code=‘week‘]").css("display","inline-block");
             $("#Compare-circle-selected >span[code=‘day‘]").css("display","none");
             break;
         case "day":
             $("#Compare-circle-selected >span[code=‘season‘]").css("display","none");
             $("#Compare-circle-selected >span[code=‘month‘]").css("display","inline-block");
             $("#Compare-circle-selected >span[code=‘week‘]").css("display","none");
             $("#Compare-circle-selected >span[code=‘day‘]").css("display","inline-block");
             break;
         default:
     } },

 var $arr=$("#Compare-circle-selected select");
 var params={}; for(var i=0;i<$arr.length;i++){
     var item=$arr[i];
     params[item.name]=item.value; 
} 

时间选择器

标签：

原文地址：http://www.cnblogs.com/xiaomurunning/p/5396351.html