解决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 相关文章推荐
脚本吧 - 幻宇工作室用到js,超强推荐expand.js
Dec 23 Javascript
jQuery中需要注意的细节问题小结
Dec 06 Javascript
将查询条件的input、select清空
Jan 14 Javascript
javascript手工制作悬浮菜单
Feb 12 Javascript
javascript对象的相关操作小结
May 16 Javascript
关于input全选反选恶心的异常情况
Jul 24 Javascript
防止Node.js中错误导致进程阻塞的办法
Aug 11 Javascript
Angular2监听页面大小变化的解决方法
Oct 09 Javascript
vue3.0 CLI - 3.2 路由的初级使用教程
Sep 20 Javascript
通过JavaScript下载文件到本地的方法(单文件)
Mar 17 Javascript
Vue中qs插件的使用详解
Feb 07 Javascript
Vuex中的Mutations的具体使用方法
Jun 01 Javascript
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
php快速url重写更新版[需php 5.30以上]
2010/04/25 PHP
php制作unicode解码工具(unicode编码转换器)代码分享
2013/12/24 PHP
thinkphp5实现微信扫码支付
2019/12/23 PHP
Javascript创建Silverlight Plugin以及自定义nonSilverlight和lowSilverlight样式
2010/06/28 Javascript
js使用函数绑定技术改变事件处理程序的作用域
2011/12/26 Javascript
setTimeout的延时为0时多个浏览器的区别
2012/05/23 Javascript
Javascript的常规数组和关联数组对比小结
2012/05/24 Javascript
JavaScript中split() 使用方法汇总
2015/04/17 Javascript
js实现图片点击左右轮播
2015/07/08 Javascript
javascript弹出拖动窗口
2015/08/11 Javascript
详解JavaScript中的Unescape()和String() 函数
2015/11/09 Javascript
JS中取二维数组中最大值的方法汇总
2016/04/17 Javascript
详解webpack异步加载业务模块
2017/06/23 Javascript
详解React 16 中的异常处理
2017/07/28 Javascript
Vuex 进阶之模块化组织详解
2018/01/12 Javascript
JS使用Date对象实时显示当前系统时间简单示例
2018/08/23 Javascript
详解如何理解vue的key属性
2019/04/14 Javascript
Vue项目中使用WebUploader实现文件上传的方法
2019/07/21 Javascript
js实现div色块拖动录制
2020/01/16 Javascript
用js限制网页只在微信浏览器中打开(或者只能手机端访问)
2020/12/24 Javascript
jQuery三组基本动画与自定义动画操作实例总结
2020/05/09 jQuery
Vue触发input选取文件点击事件操作
2020/08/07 Javascript
跟老齐学Python之list和str比较
2014/09/20 Python
python对视频画框标记后保存的方法
2018/12/07 Python
pytorch 批次遍历数据集打印数据的例子
2019/12/30 Python
PyQt5+Pycharm安装和配置图文教程详解
2020/03/24 Python
Java中有几种类型的流?JDK为每种类型的流提供了一些抽象类以供继承,请说出他们分别是哪些类?
2012/05/30 面试题
应届生财务管理求职信
2013/11/06 职场文书
成龙洗发水广告词
2014/03/14 职场文书
计算机应用应届生求职信
2014/07/12 职场文书
2014年审计人员工作总结
2014/12/19 职场文书
入党群众意见范文
2015/06/02 职场文书
《风娃娃》教学反思
2016/02/18 职场文书
mysql连接查询中and与where的区别浅析
2021/07/01 MySQL
Golang 结构体数据集合
2022/04/22 Golang
Java Spring读取和存储详细操作
2022/08/05 Java/Android