对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 相关文章推荐
javascript 学习之旅 (2)
Feb 05 Javascript
js实现仿百度汽车频道选择汽车图片展示实例
May 06 Javascript
简单分析javascript面向对象与原型
May 21 Javascript
概述如何实现一个简单的浏览器端js模块加载器
Dec 07 Javascript
Node.js查找当前目录下文件夹实例代码
Mar 07 Javascript
ES6新特性之函数的扩展实例详解
Apr 01 Javascript
利用Javascript实现一套自定义事件机制
Dec 14 Javascript
angularjs select 赋值 ng-options配置方法
Feb 28 Javascript
angular第三方包开发整理(小结)
Apr 19 Javascript
对vue中v-if的常见使用方法详解
Sep 28 Javascript
Layui tree 下拉菜单树的实例代码
Sep 21 Javascript
详解JavaScript 事件流
Sep 02 Javascript
在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
攻克CakePHP系列二 表单数据显示
2008/10/22 PHP
php中使用preg_match_all匹配文章中的图片
2013/02/06 PHP
php 三大特点:封装,继承,多态
2017/02/19 PHP
js更优雅的兼容
2010/08/12 Javascript
validator验证控件使用代码
2010/11/23 Javascript
如何获取JQUERY AJAX返回的JSON结果集实现代码
2012/12/10 Javascript
nodejs读取memcache示例分享
2014/01/02 NodeJs
javascript中拼接HTML字符串的最快、最好的方法
2014/06/07 Javascript
AngularJS中的过滤器使用详解
2015/06/16 Javascript
javascript中setAttribute()函数使用方法及兼容性
2015/07/19 Javascript
早该知道的7个JavaScript技巧
2016/06/21 Javascript
js实现滑动到页面底部自动加载更多功能
2017/02/15 Javascript
纯JS实现只能输入数字的简单代码
2017/06/21 Javascript
关于webpack2和模块打包的新手指南(小结)
2017/08/07 Javascript
基于Vue实现图书管理功能
2017/10/17 Javascript
Vue全局loading及错误提示的思路与实现
2019/08/09 Javascript
JavaScript如何把两个数组对象合并过程解析
2019/10/10 Javascript
Vue中使用wangeditor富文本编辑的问题
2021/02/07 Vue.js
使用python开发vim插件及心得分享
2014/11/04 Python
Python的collections模块中的OrderedDict有序字典
2016/07/07 Python
python3.5 + PyQt5 +Eric6 实现的一个计算器代码
2017/03/11 Python
Python实现霍夫圆和椭圆变换代码详解
2018/01/12 Python
pyspark 读取csv文件创建DataFrame的两种方法
2018/06/07 Python
python实现简单日志记录库glog的使用
2019/12/13 Python
关于pytorch处理类别不平衡的问题
2019/12/31 Python
浅谈Python 命令行参数argparse写入图片路径操作
2020/07/12 Python
10个顶级Python实用库推荐
2021/03/04 Python
越南电子产品购物网站:FPT Shop
2017/12/02 全球购物
手工制作的豪华英式沙发和沙发床:Willow & Hall
2019/05/03 全球购物
美国精品地毯网站:Boutique Rugs
2020/03/04 全球购物
C# Debug和Testing相关面试题
2015/10/25 面试题
优秀的毕业生的自我评价
2013/12/12 职场文书
初中美术教学反思
2014/01/29 职场文书
库房管理员岗位职责
2014/03/09 职场文书
党委班子对照检查材料
2014/08/19 职场文书
考教师资格证不要错过的4个最佳时机
2019/07/17 职场文书