解决layer.open后laydate失效的问题


Posted in Javascript onSeptember 06, 2019

如果你的open方式是1(html)的话这样是可以的,

如果是2(iframe)方式打开,你把注入的代码写在打开的界面就可以了不用这样写,open的参数type是有区别的,所以请注意:

今天在开发项目时候使用到了laydate,按照官方文档说明使用发现出现下面的问题:

1.在正常页面中使用laydate组件没有问题,点击可以正常显示出来

2.但是在layer.open打开一个窗体后就没有效果了

分析思路:由于页面的加载如果js在页面元素显示之前就执行,那么就会出现无法渲染组件的问题,所有决定等元素渲染后再执行js,

于是先看官方对layer的文档官方layer弹出窗文档,发现success参数说明:当你需要在层创建完毕时执行一些语句,可以通过该回调。

所有把对laydate的渲染放在这里即可,下面是success中的代码:

success: function(layero, index) {//成功后注入事件,不然js在页面完成完成之前就执行,点击没有效果
 laydate.render({
 elem: '#publishTime', //指定元素
 type: 'datetime', //日期格式类型
 });
}

最后记得使用到什么组件需要引入才可以。

以上这篇解决layer.open后laydate失效的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
线路分流自动跳转代码;希望对大家有用!
Dec 02 Javascript
Javascript select下拉框操作常用方法
Nov 09 Javascript
Ruffy javascript 学习笔记
Nov 30 Javascript
JavaScript禁止页面操作的示例代码
Dec 17 Javascript
jquery自定义滚动条插件示例分享
Feb 21 Javascript
Hammer.js+轮播原理实现简洁的滑屏功能
Feb 02 Javascript
JavaScript编程学习技巧汇总
Feb 21 Javascript
ES6所改良的javascript“缺陷”问题
Aug 23 Javascript
AngularJS实现在ng-Options加上index的解决方法
Nov 03 Javascript
Node.js dgram模块实现UDP通信示例代码
Sep 26 Javascript
JS实现多选框的操作
Jun 24 Javascript
Vue解决移动端弹窗滚动穿透问题
Dec 15 Vue.js
layui的表单验证支持ajax判断用户名是否重复的实例
Sep 06 #Javascript
layui在form表单页面通过Validform加入简单验证的方法
Sep 06 #Javascript
layui自定义验证,用ajax查询后台是否有重复数据,form.verify的例子
Sep 06 #Javascript
layer的prompt弹出框,点击回车,触发确定事件的方法
Sep 06 #Javascript
vue按需加载实例详解
Sep 06 #Javascript
详解Nuxt.js中使用Element-UI填坑
Sep 06 #Javascript
nuxt踩坑之Vuex状态树的模块方式使用详解
Sep 06 #Javascript
You might like
风味层面去分析咖啡油脂
2021/03/03 咖啡文化
对YUI扩展的Gird组件 Part-1
2007/03/10 Javascript
JavaScript中两种链式调用实现代码
2011/01/12 Javascript
JQuery+JS实现仿百度搜索结果中关键字变色效果
2011/08/02 Javascript
纯js写的分页表格数据为json串
2014/02/18 Javascript
jquery插件开发之实现google+圈子选择功能
2014/03/10 Javascript
AngularJS 过滤与排序详解及实例代码
2016/09/14 Javascript
JS实现倒计时(天数、时、分、秒)
2016/11/16 Javascript
实例详解JavaScript中setTimeout函数的执行顺序
2017/07/12 Javascript
bootstrap基本配置_动力节点Java学院整理
2017/07/14 Javascript
AngularJS使用ng-repeat遍历二维数组元素的方法详解
2017/11/11 Javascript
在HTML文档中嵌入JavaScript的四种方法
2018/05/07 Javascript
vue-cli webpack配置文件分析
2019/05/20 Javascript
JavaScript实现移动端弹窗后禁止滚动
2020/05/25 Javascript
html+vue.js 实现漂亮分页功能可兼容IE
2020/11/07 Javascript
Python使用django框架实现多人在线匿名聊天的小程序
2017/11/29 Python
使用50行Python代码从零开始实现一个AI平衡小游戏
2018/11/21 Python
Python利用scapy实现ARP欺骗的方法
2019/07/23 Python
Python namedtuple命名元组实现过程解析
2020/01/08 Python
基于python监控程序是否关闭
2020/01/14 Python
Python关于反射的实例代码分享
2020/02/20 Python
TensorFlow使用Graph的基本操作的实现
2020/04/22 Python
Python 生成短8位唯一id实战教程
2021/01/13 Python
使用 CSS3 中@media 实现网页自适应的示例代码
2020/03/24 HTML / CSS
C语言笔试集
2012/07/24 面试题
法律工作求职自荐信
2013/10/31 职场文书
银行个人求职自荐信范文
2013/12/16 职场文书
商务专员岗位职责范本
2014/06/29 职场文书
党员一帮一活动总结
2014/07/08 职场文书
2014年高校辅导员工作总结
2014/12/09 职场文书
一年级数学上册复习计划
2015/01/17 职场文书
环保建议书作文400字
2015/09/14 职场文书
《你在为谁工作》心得体会(共8篇)
2016/01/20 职场文书
Pandas加速代码之避免使用for循环
2021/05/30 Python
Python Flask搭建yolov3目标检测系统详解流程
2021/11/07 Python
MySQL如何修改字段类型和字段长度
2022/06/10 MySQL