浅谈layui时间控件闪退问题的解决方案

项目上线,发现后台管理系统layui的子页面出现时间控件闪退的问题,根本选取不到时间。

其原因是:如果出现页面找到多个节点,只有第一个节点能正常使用后面的节点都会闪退,可以理解为目前laydate不支持一次性render多个节点。不是什么实例重复的问题,因为我每个页面创建的实例都不一样还是闪退。而后台管理系统中这种父子页面确实有多个页面使用了时间控件,从而render多个节点。

解决方法:

laydate文件中的默认配置,trigger: 'focus' //呼出控件的事件这个focus改成click。

测试部署上线有效。

layui.use('laydate', function(){
    var laydate = layui.laydate;

    //日期时间选择器
    laydate.render({
        elem: '#startTime'
        ,type: 'datetime'
        ,trigger: 'click'//呼出事件改成click
        //,format: 'yyyy-MM-dd HH:mm:ss' //可任意组合
    });
    //日期时间选择器
    laydate.render({
        elem: '#endTime'
        ,type: 'datetime'
        ,trigger: 'click'//呼出事件改成click
        // ,format: 'yyyy-MM-dd HH:mm:ss' //可任意组合
    });
});

推荐文章
layui算是前端框架吗?

layui首个版本发布于2016年秋,她区别于那些基于MVVM底层的UI框架,却并非逆道而行,而是信奉返璞归真之道。准确地说,她更多是为服务端程序员量身定做,你无需涉足各种前端工具的复杂配置,只需面对

layui怎么设置时间选择框?

Layui中时间格式的输入框:html代码: 选择日期: -- - js代码:layui.use(['layer','form','table','laydate'],function()

layui如何抓取表单数据?

注意事项:1、layui中提交按钮是基于“监听”机制实现的。2、form.on()的调用需置于layui.use的回调函数中。3、末尾的'returnfalse'不可或缺,以确保不会触发页面刷新。注意

laypage组件常见用法总结

laypage的使用非常简单,指向一个用于存放分页的容器,通过服务端得到一些初始值,即可完成分页渲染。核心方法:laypage.render(options)来设置基础参数。一、laypage的常用基

layui开源么?

layui是免费开源的,layui是开源的模块化前端UI框架,而layAdmin和layIm是付费授权的。layui是一款采用自身模块规范编写的前端UI框架,遵循原生HTML/CSS/JS的书写与组织

layui兼不兼容ie8?

layui兼不兼容ie8?layui兼容ie8,layui兼容人类正在使用的全部浏览器(IE6/7除外),可作为PC端后台系统与前台界面的速成开发方案。layui(谐音:类UI)是一款采用自身模块规范

layui input只读属性是什么?

layuiinput只读属性是什么?layuiinput只读属性是readonly。readonly属性规定输入字段为只读。只读字段是不能修改的。不过,用户仍然可以使用tab键切换到该字段,还可以选中

layui弹窗如何禁止拉伸?

弹层组件文档-layui.layerayer至今仍作为layui的代表作,她的受众广泛并非偶然,而是这数年来的坚持、不弃的执念,将那些不屑的眼光转化为应得的尊重,不断完善和维护、不断建设和提升社区服务

layui是啥框架?

layui首个版本发布于2016年金秋,她区别于那些基于MVVM底层的UI框架,却并非逆道而行,而是信奉返璞归真之道。准确地说,她更多是为服务端程序员量身定做,你无需涉足各种前端工具的复杂配置,只需面

layui是什么时候开发的?

layui(谐音:类UI)是一款采用自身模块规范编写的前端UI框架,遵循原生HTML/CSS/JS的书写与组织形式,门槛极低,拿来即用。其外在极简,却又不失饱满的内在,体积轻盈,组件丰盈,从核心代码到

layui和layer的区别是什么?

layui是之前layerlaydate等独立组件的超集合;layui是一个完整的前端框架,和Bootstrap是同一类事务;引入了layui之后layer就不用单独引入了。layer至今仍作为lay

浅谈Layui如何实现input输入和选择

Layui实现input输入和选择的方法:HTML代码: 移交单位* 111 222 333 444 555 其中input的几个style样式简单说一下。position:absolu

layui怎么隐藏表格行?

layui数据表格隐藏列在使用layui做数据表格的时候,插入的数据的id是不是一组连续的数字,那么就需要用到layui的cols的type属性。table.render({ elem:'#test'

浅谈layui中iframe跳转链接和页面按钮跳转相关问题

一、导航跳转iframe页面问题:关于layui的iframe嵌套页面的导航跳转页面问题,如下图所示可以看到效果:在模板页的导航代码: 所有商品 商品列表 商品属性 商品分类 添加 解决方案

浅谈layui弹出层(open)的属性

layui.open属性如:打开一个弹出层核心方法varindex=layer.open({ type:2, title:title, maxmin:true, offset:'100px', are

Django+Layui学习之浅谈后台布局

前言Layui对于没有太多前端基础的我来说,第一次接触还是有点困难,不过文档还算详细,摸索着的逐渐的了解了,这次来说下后台布局。Layui后台布局:一、后台布局之顶边栏 layui后台布局 控制台

layui如何支持 es5 写法?方法介绍

写js的时候会写一些es5的代码,但是打包到dist时,发现不支持语法,怎么办呢。两步添加es5支持:一、使用npm下载安装babel,进入gulpfile.js所在目录。$npminstall--s

浅谈layui中的table字段筛选功能

table模块在layui2.0的版本中全新推出,是layui框架最核心的组成之一。本篇文章就来为大家介绍一下layui框架的table模块的字段筛选功能,希望对大家有一定的帮助。先看效果,使用过ex

layui之弹出form表单以及提交

第一步:引用两个文件第二步:点击删除按钮弹出提示框/*删除开始*/ $(".del").click(function(){ varid=$(this).attr("id"); layer.alert(

浅谈layui表单中的inline和block

layui表单中的inline和block:block:block元素会独自占一行,多个block元素各自新起一行,默认情况下,block元素宽度自动填充其父元素宽度 单行输入框 验证必填项