LayUI中的时间日期控件,设置时间范围,过去的时间不能选择,只能选择未来的时间
程序员文章站
2022-05-27 20:31:31
...
默认Layui中的时间控件显示如下:
我当时系统时间是2018-06-07,大家可以看到,过去的时间还是能选择的。
考虑到项目需求,很大可能选择日期只能是未来的时间。如:还款日期,发布日期,项目上线时间等。
默认显示一个时间框的代码如下:
<input type="text" name="publish_date" id="date" lay-verify="date" placeholder="年-月-日" autocomplete="off" class="layui-input">
相应js如下:
<script>
layui.use(['form', 'laydate',"upload","jquery"], function(){
laydate = layui.laydate;
laydate.render({ //发布时间
elem: '#date'
});
});
</script>
解决方法
修改相关脚本如下:
laydate.render({ //发布时间
elem: '#date',
min:minDate()
});
// 设置最小可选的日期
function minDate(){
var now = new Date();
return now.getFullYear()+"-" + (now.getMonth()+1) + "-" + now.getDate();
}
这样配置之后,只能选择未来的时间点了,同理,要设置可选时间段,只需要配置min:日期,max:日期两个参数即可。
效果如下:
推广:
专业墙纸贴纸厨房用具装饰出售,本人网店经营,访问即是爱
博客对你有用记得访问下哦,增加下访问量,如有需要可以下单购买哦^_^。https://item.taobao.com/item.htm?id=570637716145
上一篇: 蔡伦除了造纸术之外还有哪些贡献呢?