对layui中的onevent 和event的使用详解


Posted in Javascript onSeptember 06, 2019

这是官方文档的说明

layui.onevent(modName, events, callback) 自定义模块事件,属于比较高级的应用。有兴趣的同学可以阅读layui.js源码以及form模块
layui.event(modName, events, params) 执行自定义模块事件,搭配onevent使用

参数1我暂时理解为组,定义子级方法和使用event调用都需要注意这个参数必须一致

参数二是定义父级方法名,如果有需要定义该方法的子方法时候同样使用onevent,但参数二的方法名需要与父级相同并已加上括号

如下面的代码中data方法,定义子方法就是data(1),

如果使用layui.event方法调用data(1),方法即会data(1)和data方法

//监听Tab切换,以改变地址hash值
      element.on("tab(test)", function() {
        // location.hash = "test=" + this.getAttribute("lay-id");
      //使用event调用data(1)方法并传入参数,这时候这里会触发data方法和data(1)方法
        layui.event('groupData','data(1)',this.getAttribute("lay-id"));
      });
      //定义父级方法data
      layui.onevent('groupData','data',function(gid){
          console.log(gid); 
      });
      //定义子方法data(1)
      layui.onevent('groupData','data(1)',function(gid){
       console.log(1321321);
      });

以上均为本人使用经验理解,如有说错,欢迎大家指出!

这篇对layui中的onevent 和event的使用详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JQuery获取当前屏幕的高度宽度的实现代码
Jul 12 Javascript
firefox下input type="file"的size是多大
Oct 24 Javascript
js中的onchange和onpropertychange (onchange无效的解决方法)
Mar 08 Javascript
JS 新增Cookie 取cookie值 删除cookie 举例详解
Oct 10 Javascript
jQuery绑定自定义事件的魔法升级版
Jun 30 Javascript
js获取浏览器高度 窗口高度 元素尺寸 偏移属性的方法
Nov 21 Javascript
react redux入门示例
Apr 19 Javascript
angular6.0开发教程之如何安装angular6.0框架
Jun 29 Javascript
webpack3里使用uglifyjs压缩js时打包报错的解决
Dec 13 Javascript
ES6 更易于继承的类语法的使用
Feb 11 Javascript
js实现带箭头的进度流程
Mar 26 Javascript
vue登录页实现使用cookie记住7天密码功能的方法
Feb 18 Vue.js
在layui下对元素进行事件绑定的实例
Sep 06 #Javascript
Nuxt.js实现一个SSR的前端博客的示例代码
Sep 06 #Javascript
layui type2 通过url给iframe子页面传值的例子
Sep 06 #Javascript
使用layui的router来进行传参的实现方法
Sep 06 #Javascript
layui关闭弹窗后刷新主页面和当前更改项的例子
Sep 06 #Javascript
layui关闭层级、简单监听的实例
Sep 06 #Javascript
layui表格内容溢出的解决方法
Sep 06 #Javascript
You might like
如何选购合适的收音机
2021/03/01 无线电
PHP面向对象分析设计的经验原则
2008/09/20 PHP
php插入中文到sqlserver 2008里出现乱码的解决办法分享
2012/07/19 PHP
让Laravel API永远返回JSON格式响应的方法示例
2018/09/05 PHP
jQuery Study Notes学习笔记 (二)
2010/08/04 Javascript
jQuery中Ajax的load方法详解
2015/01/14 Javascript
javascript实现根据iphone屏幕方向调用不同样式表的方法
2015/07/13 Javascript
js实现的简洁网页滑动tab菜单效果代码
2015/08/24 Javascript
浅析Javascript中bind()方法的使用与实现
2016/05/30 Javascript
js仿百度切换皮肤功能(html+css)
2016/07/10 Javascript
Jquery获取当前城市的天气信息
2016/08/05 Javascript
AngularJS通过$sce输出html的方法
2016/09/22 Javascript
AngularJS  双向数据绑定详解简单实例
2016/10/20 Javascript
AngularJs篇:使用AngularJs打造一个简易权限系统的实现代码
2016/12/26 Javascript
jQueryeasyui 中如何使用datetimebox 取两个日期间相隔的天数
2017/06/13 jQuery
vue小图标favicon不显示的解决方案
2017/09/19 Javascript
vue如何判断dom的class
2018/04/26 Javascript
js实现导航跟随效果
2018/11/17 Javascript
微信小程序网络层封装的实现(promise, 登录锁)
2019/05/08 Javascript
微信小程序实现批量倒计时功能
2020/11/01 Javascript
bootstrap table插件动态加载表头
2019/07/19 Javascript
webpack常用构建优化策略小结
2019/11/21 Javascript
解决ant design vue 表格a-table二次封装,slots渲染的问题
2020/10/28 Javascript
python处理图片之PIL模块简单使用方法
2015/05/11 Python
Python制作爬虫抓取美女图
2016/01/20 Python
基于Django的ModelForm组件(详解)
2017/12/07 Python
Django多进程滚动日志问题解决方案
2019/12/17 Python
在Python中用GDAL实现矢量对栅格的切割实例
2020/03/11 Python
Scrapy基于scrapy_redis实现分布式爬虫部署的示例
2020/09/29 Python
moosejaw旗下的户外商品促销网站:Mountain Steals
2017/02/27 全球购物
加拿大在线眼镜零售商:SmartBuyGlasses加拿大
2019/05/25 全球购物
英国在线购买轮胎、预订汽车、汽车维修和装配网站:Protyre
2020/04/12 全球购物
EJB包括(SessionBean,EntityBean)说出他们的生命周期,及如何管理事务的
2015/07/24 面试题
高中军训感言200字
2014/02/23 职场文书
见习期个人总结
2015/03/05 职场文书
Python集合set()使用的方法详解
2022/03/18 Python