码迷,mamicode.com
首页 > 其他好文 > 详细

时间选择器

时间:2016-04-15 20:00:35      阅读:274      评论:0      收藏:0      [点我收藏+]

标签:

<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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!