在工作中,经常碰到需要查询两个日期之间数据,但是两个日期之间的间隔,又要有要求,本文以WdatePicker的日期组件为例,用JS代码控制两个日期组件的间隔不能大于30天
JS函数
JS函数
//前后日期相差不能大于30天
var md=new Date(); //第二个输入框最大值的全局变量
//第一个输入框选择好日期的时候操作
function pickedFunc(){
var Y=$dp.cal.getP('y'); //用内置方法获取到选中的年月日
var M=$dp.cal.getP('M');
var D=$dp.cal.getP('d');
M=parseInt(M,10)-1;
D=parseInt(D,10)+30;//字符串的数字转换成int再运算。并且如果超过30天,也能自动处理。
var d = new Date();
d.setFullYear(Y,M,D);//设置时间
var nowDate=new Date();
if(nowDate<=d){ //现在的时间比较,如果算出来的值大于现在时间,修改全局变量md为现在时间。
md=nowDate;
}else{ //全局变量设置为算出来的值得
var month=d.getMonth()+1; //月份的范围是(0到11);
md=d.getFullYear()+"-"+month+"-"+d.getDate(); //直接把d给过去会有问题,所以拼成字符串发过去
}
}
//第一个清空的时候的操作
function clearedFunc(){
md=new Date();
}
//给第二个输入框定义规则
function picker2rule(ele){
WdatePicker({el:ele,minDate:'#F{$dp.$D(\'startDate\')}',maxDate:md});
}
页面组件
<input type="text" name="startDate" id="startDate" style="width:150px"
οnfοcus="WdatePicker({maxDate:'#F{$dp.$D(\'endDate\')||\'new Date()\'}',
minDate:'#F{$dp.$D(\'endDate\',{d:-30})}',onpicked:pickedFunc,oncleared:clearedFunc})" class="Wdate"></input>
<input type="text" name="endDate" id="endDate" style="width:150px" οnfοcus="picker2rule(this)" class="Wdate"></input>
页面效果