<!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=gbk" /> <title>select hours interval 3</title> <SCRIPT type=text/javascript src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></SCRIPT> <script language="javascript"> $(function(){ var obj_setHours ={ jq_hour_start_select : '', jq_hour_end_select : '', bind_ids:function(select_start_id,select_end_id){ this.jq_hour_start_select = $('#'+select_start_id); this.jq_hour_end_select = $('#'+select_end_id); }, //开始时间初始化 hour_start_select_init:function(){ this.jq_hour_start_select.empty(); this.jq_hour_start_select.append($('<option value="" selected>请选择</option>')); for(var i =0;i<24;i++ ){ this.jq_hour_start_select.append($('<option value='+i+'>'+i+'时</option>')); } }, hour_start_select_change:function(){ //记录先前hour_end_select值 var hour_end_select_val = this.jq_hour_end_select.val(); var hour_start_select_val = this.jq_hour_start_select.val(); //先添加全部,再去除不符合条件的 this.hour_end_select_init(); if(''!=hour_start_select_val){ var that = this; this.jq_hour_end_select.children().each(function(){ if(that.hour_start_select_change_judge(hour_start_select_val,this)){ $(this).remove(); } }); } //赋予先前选中的值 this.jq_hour_end_select.val([hour_end_select_val]); }, //判断是否除去的逻辑 hour_start_select_change_judge:function(judge_val,opt){ if(parseInt(judge_val)>=parseInt($(opt).val())){ return true; } return false; }, //结束时间初始化 hour_end_select_init:function(){ this.jq_hour_end_select.empty(); this.jq_hour_end_select.append($('<option value="" selected>请选择</option>')); for(var i =1;i<25;i++ ){ this.jq_hour_end_select.append($('<option value='+i+'>'+i+'时</option>')); } }, hour_end_select_change:function(){ //记录先前hour_start_select值 var hour_start_select_val = this.jq_hour_start_select.val(); var hour_end_select_val = this.jq_hour_end_select.val(); //先添加全部,再去除不符合条件的 this.hour_start_select_init(); if(''!= hour_end_select_val){ var that = this; this.jq_hour_start_select.children().each(function(){ if(that.hour_end_select_change_judge(hour_end_select_val,this)){ $(this).remove(); } }); } //赋予先前选中的值 this.jq_hour_start_select.val([hour_start_select_val]); }, //判断是否除去的逻辑 hour_end_select_change_judge:function(judge_val,opt){ if(parseInt(judge_val)<=parseInt($(opt).val())){ return true; } return false; }, statistics:function(){ if(''==this.jq_hour_start_select.val()){ alert('请选择开始的时间!!'); this.jq_hour_start_select.focus(); return; } if(''==this.jq_hour_end_select.val()){ alert('请选择结束的时间!!'); this.jq_hour_end_select.focus(); return; } confirm(this.jq_hour_start_select.val()+'---'+this.jq_hour_end_select.val()); } }; obj_setHours.bind_ids('hour_start_select','hour_end_select'); obj_setHours.hour_start_select_init(); obj_setHours.hour_end_select_init(); $('#statistics_btn').bind("click",function(){ obj_setHours.statistics(); }); $('#hour_start_select').bind('change',function(){ obj_setHours.hour_start_select_change(); }); $('#hour_end_select').bind('change',function(){ obj_setHours.hour_end_select_change(); }); }); </script> </head> <body> <div id="mode_div"> 按天统计: <select id='hour_start_select'></select> 至 <select id="hour_end_select"></select> <button id="statistics_btn">统计</button> </div> </body> </html>
http://www.cnblogs.com/shuaisam/archive/2012/05/18/2507242.html