解决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 相关文章推荐
JavaScript 脚本将当地时间转换成其它时区
Mar 19 Javascript
纯JavaScript实现的完美渐变弹出层效果代码
Apr 02 Javascript
自动设置iframe大小的jQuery代码
Sep 11 Javascript
简介JavaScript中的italics()方法的使用
Jun 08 Javascript
JS常见问题之为什么点击弹出的i总是最后一个
Jan 05 Javascript
JS对大量数据进行多重过滤的方法
Nov 04 Javascript
vue中使用element-ui进行表单验证的实例代码
Jun 22 Javascript
vue-awesome-swiper 基于vue实现h5滑动翻页效果【推荐】
Nov 08 Javascript
Vue.js的复用组件开发流程完整记录
Nov 29 Javascript
vue权限问题的完美解决方案
May 08 Javascript
详解vue-cli3多页应用改造
Jun 04 Javascript
vue实现前端列表多条件筛选
Oct 26 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
收音机频率指针指示不准确和灵敏度低问题
2021/03/02 无线电
php读取html并截取字符串的简单代码
2009/11/30 PHP
php使用ob_flush不能每隔一秒输出原理分析
2015/06/02 PHP
phpMyAdmin无法登陆的解决方法
2017/04/27 PHP
PHP pthreads v3在centos7平台下的安装与配置操作方法
2020/02/21 PHP
一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
2009/05/21 Javascript
Extjs列表详细信息窗口新建后自动加载解决方法
2010/04/02 Javascript
基于jquery封装的一个js分页
2011/11/15 Javascript
jQuery load方法用法集锦
2011/12/06 Javascript
nodejs中exports与module.exports的区别详细介绍
2013/01/14 NodeJs
nodejs通过phantomjs实现下载网页
2015/05/04 NodeJs
jquery专业的导航菜单特效代码分享
2015/08/29 Javascript
js输出数据精确到小数点后n位代码
2016/07/02 Javascript
js正则表达式惰性匹配和贪婪匹配用法分析
2016/12/26 Javascript
Vue中的混入的使用(vue mixins)
2018/06/01 Javascript
jQuery.validate.js表单验证插件的使用代码详解
2018/10/22 jQuery
微信小程序与公众号卡券/会员打通的问题
2019/07/25 Javascript
vue项目实现设置根据路由高亮对应的菜单项操作
2020/08/06 Javascript
[02:32]DOTA2英雄基础教程 美杜莎
2014/01/07 DOTA
Python实现的文本编辑器功能示例
2017/06/30 Python
python+selenium识别验证码并登录的示例代码
2017/12/21 Python
对python遍历文件夹中的所有jpg文件的实例详解
2018/12/08 Python
python 提取key 为中文的json 串方法
2018/12/31 Python
对python中的try、except、finally 执行顺序详解
2019/02/18 Python
python实现身份证实名认证的方法实例
2019/11/08 Python
python3+opencv生成不规则黑白mask实例
2020/02/19 Python
Python如何使用27行代码绘制星星图
2020/07/20 Python
浅谈cookie和localStorage那些事
2019/08/27 HTML / CSS
应届大学毕业生找工作的求职信范文
2013/11/29 职场文书
计算机专业应届生求职信
2014/04/06 职场文书
英文邀请函
2015/02/02 职场文书
会计专业求职信范文
2015/03/19 职场文书
幼儿园辞职信
2015/05/13 职场文书
创业计划书之情侣餐厅
2019/09/29 职场文书
SqlServer数据库远程连接案例教程
2021/07/15 SQL Server
Ajax实现三级联动效果
2021/10/05 Javascript