之前写过一篇文章:lay-key引发的laydate闪现问题 ,解决因为页面中 lay-key
导致的 laydate 日期时间控件弹出层闪退的问题。
今天有幸又使用了 layui 的日期控件,也看了一下官方文档,发现页面中的第一个控件可以正常使用,其他的都会有闪退现象。
代码如下:
HTML
<div class="input-text"> <input class="lay-date" name="learnTimeS" type="text" placeholder="请选择"> - <input class="lay-date" name="learnTimeE" type="text" placeholder="请选择"> </div>
初始化 laydate
layui.use('laydate', function(){ var laydate = layui.laydate; laydate.render({ elem: '.lay-date' }); });
从控制台查看网页代码可以发现,这样初始化之后,页面中所有的 laydate 控件的 lay-key
的值全部为 1
。
这也就是页面中只有第一个能用,其他的 laydate 控件全部闪退的原因。
解决方法
遍历页面中的 lay-date 元素,挨个给它初始化:
layui.use('laydate', function(){ var laydate = layui.laydate; lay('.lay-date').each(function(){ laydate.render({ elem: this, trigger: 'click' }); }); });
这样,就可以正常显示了。
未经允许不得转载:w3h5 » 页面存在多个laydate日期控件,点击弹出层闪退问题解决
原创文章,作者:奋斗,如若转载,请注明出处:https://blog.ytso.com/tech/pnotes/150502.html