laydata 点击日期闪现

时间:2022-06-25 15:30:58

因项目需求需要多个日期,然后点击日期就会出现闪现的情况,导致选择不了日期

html代码

 <table class="form">
<tr>
<th class="formTitle">开始日期:</th>
<td class="formValue" colspan="2">
<input id="StartDate" name="StartDate" type="text" class="form-control layui-input test-item" placeholder="开始日期" /> </td>
</tr>
<tr>
<th class="formTitle">计划完成日期:</th>
<td class="formValue" colspan="2">
<input id="EndDate" name="EndDate" type="text" class="form-control layui-input test-item" placeholder="计划完成日期"/>
</td>
</tr>
<tr>
<th class="formTitle">实际完成日期:</th>
<td class="formValue" colspan="2">
<input id="ActualDate" name="ActualDate" type="text" class="form-control layui-input test-item" placeholder="实际完成日期"/>
</td>
</tr>
</table>

js

前提需要引入laydata.js

最重要的js

//同时绑定多个日期
lay('.test-item').each(function () { //test-item是引入日期所需要加入的类名
    laydate.render({ 
elem: this ,
trigger: 'click'
});
});
<script>   

    laydate.render({
elem: '#StartDate', //指定元素
format: 'yyyy-MM-dd',
istime: false, //是否显示分钟
istoday: true, //是否显示今天
theme: '#1ABC9C',
choose: function (datas) {
var now = new Date(laydate.now().replace("-", "/"));
var add = new Date(datas.replace("-", "/"));
add = new Date(add.getTime() + 30 * 24 * 60 * 60 * 1000);
if ((now.getMonth() + 1) < (add.getMonth() + 1)) {
end.min = laydate.now();
} else if ((now.getMonth() + 1) == (add.getMonth() + 1) && now.getDate() < add.getDate()) {
end.min = laydate.now();
}
else {
add = add.getFullYear() + "/" + (add.getMonth() + 1) + "/" + add.getDate();
end.min = add;
}
end.min = datas;
}, });
laydate.render({
elem: '#EndDate', //指定元素
format: 'yyyy-MM-dd',
istime: false, //是否显示分钟
istoday: true, //是否显示今天
theme: '#1ABC9C',
choose: function (datas) {
var max = new Date(datas.replace("-", "/"));
max = new Date(max.getTime() - 30 * 24 * 60 * 60 * 1000);
max = max.getFullYear() + "/" + (max.getMonth() + 1) + "/" + max.getDate();
start.max = datas;
start.min = laydate.now();
}, }); laydate.render({
elem: '#ActualDate', //指定元素
format: 'yyyy-MM-dd',
istime: false, //是否显示分钟
istoday: true, //是否显示今天
theme: '#1ABC9C',
choose: function (datas) {
var now = new Date(laydate.now().replace("-", "/"));
var add = new Date(datas.replace("-", "/"));
add = new Date(add.getTime() + 30 * 24 * 60 * 60 * 1000);
if ((now.getMonth() + 1) < (add.getMonth() + 1)) {
end.min = laydate.now();
} else if ((now.getMonth() + 1) == (add.getMonth() + 1) && now.getDate() < add.getDate()) {
end.min = laydate.now();
}
else {
add = add.getFullYear() + "/" + (add.getMonth() + 1) + "/" + add.getDate();
end.min = add;
}
end.min = datas;
}, }); </script>