记录layui laydata控件闪退的问题
问题描述:点击input框时,时间选择框会出现闪退的情况
#问题分析:经查看发现实际上是时间弹窗自身计算了当前浏览器的可用高度,当高度不足以显示时间选择框时,则会自动偏移,导致鼠标可以点击到时间选择框,从而导致input框失去焦点、时间选择框隐藏。最终结合layui官方文档最终解决;
主要原因是时间控件函数里没有添加trigger: 'click'
,就会导致党时间控件靠近浏览器窗口边缘的时候,时间控件没有找到合适位置打开日期弹框。防止页面被缩小查看,建议都写
<input class="layui-input" placeholder="查询日期" id="id" name="checkDate">
<script>
layui.use(['form','laydate'],function(){
laydate.render({
elem:'#id'
,format:'yyyy-MM-dd'
,max:'2099-06-16'
,min:'1980-01-01'
});
});
</script>
<input type="text" class="layui-input test-item" placeholder="审核时间" value="${model.checkDate}" name="checkDate">
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
lay('.test-item').each(function(){
laydate.render({
elem: this
,format:'yyyy-MM-dd HH:mm:ss'
,type:'datetime'
,trigger: 'click'
});
});
});
</script>