html页面日期组件:
<div class="layui-inline">
<label class="layui-form-label">开始日期:<span
class="layui-font-red">*</span>:</label>
<div class="layui-input-inline" id="bData1">
<input type="text" name="bDate" id="bDate" lay-verify="date|required"
placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">结束日期:<span
class="layui-font-red">*</span>:</label>
<div class="layui-input-inline" id="eData1">
<input type="text" name="eDate" id="eDate" lay-verify="date|required"
placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
</div>
</div>
js渲染方法一:
//获取当前年份
var nowDateYear = new Date().getFullYear();
var minDate = nowDateYear + '-01-01';
var maxDate = nowDateYear + '-12-31';
var startDate=laydate.render({
elem: '#bDate'
,min: minDate
,max: maxDate
, done: function (value, dates) {
endDate.config.min = {
year: dates.year,
month: dates.month - 1, //关键
date: dates.date,
hours: 0,
minutes: 0,
seconds: 0
}
}
});
var endDate=laydate.render({
elem: '#eDate'
,min: minDate
,max: maxDate
,done: function (value, dates) {
startDate.config.max={
year:dates.year,
month:dates.month-1,//关键
date: dates.date,
hours: 0,
minutes: 0,
seconds : 0
}
}
});
js渲染方法二:
var beginDay = editPreBill.bDate||''; //默认值
var endDay = editPreBill.eDate||''; //默认值
//开始
writeBdate('bData',beginDay,endDay);
//结束
writeEdate('eData',endDay,beginDay);
//渲染开始日期
function writeBdate(elem1,value1,value2){
laydate.render({
elem: '#'+elem1
,value:value1//初始值
,max:value2==''?4073558400000:value2
,done:function (value, date, endDate) {
beginDay = value;
//重新结束渲染
$("#eData").remove();
$("#eData1").html(' <input type="text" name="eDate" id="eData" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">');
writeEdate("eData",value2,beginDay);
}
});
}
function writeEdate(elem1,value1,value2){
laydate.render({
elem: '#'+elem1
,value:value1//初始值
,min:value2==''?-4073558400000:value2
,done:function (value, date, endDate) {
endDay = value;
//重新渲染
$("#bData").remove();
$("#bData1").html(' <input type="text" name="bDate" id="bData" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">');
writeBdate("bData",value2,endDay);
}
});
}