对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如何扑捉回车键触发的事件
Apr 24 Javascript
javascript实现的平方米、亩、公顷单位换算小程序
Aug 11 Javascript
原生javascript实现隔行换色
Jan 04 Javascript
JavaScript操作DOM元素的childNodes和children区别
Apr 01 Javascript
Bootstrap基本样式学习笔记之表单(3)
Dec 07 Javascript
Bootstrap基本插件学习笔记之按钮(21)
Dec 08 Javascript
在js代码拼接dom对象到页面上去的模板总结(必看)
Feb 14 Javascript
Bootstrap Table使用整理(四)之工具栏
Jun 09 Javascript
写一个移动端惯性滑动&回弹Vue导航栏组件 ly-tab
Mar 06 Javascript
vue-baidu-map 进入页面自动定位的解决方案(推荐)
Apr 28 Javascript
electron + vue项目实现打印小票功能及实现代码
Nov 25 Javascript
微信小程序新手教程之启动页的重要性
Mar 03 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
从一个不错的留言本弄的mysql数据库操作类
2007/09/02 PHP
Symfony2实现在doctrine中内置数据的方法
2016/02/05 PHP
php  PATH_SEPARATOR判断当前服务器系统类型实例
2016/10/28 PHP
php中的单引号、双引号和转义字符详解
2017/02/16 PHP
JavaScript 私有成员分析
2009/01/13 Javascript
js触发onchange事件的方法说明
2014/03/08 Javascript
jquery中post方法用法实例
2014/10/21 Javascript
jQuery 重复加载错误以及修复方法
2014/12/16 Javascript
JS实现网页顶部向下滑出的全国城市切换导航效果
2015/08/22 Javascript
AngularJS ng-bind-html 指令详解及实例代码
2016/07/30 Javascript
Ionic默认的Tabs模板使用实例
2016/08/29 Javascript
angularjs使用gulp-uglify压缩后执行报错的解决方法
2018/03/07 Javascript
jQuery中的for循环var与let的区别
2018/04/21 jQuery
vue中post请求以a=a&b=b 的格式写遇到的问题
2018/04/27 Javascript
深入理解JS的事件绑定、事件流模型
2018/05/13 Javascript
解决vue中修改了数据但视图无法更新的情况
2018/08/27 Javascript
JS中appendChild追加子节点无效的解决方法
2018/10/14 Javascript
js 将线性数据转为树形的示例代码
2019/05/28 Javascript
vue实现短信验证码登录功能(流程详解)
2019/12/10 Javascript
jQuery实现中奖播报功能(让文本滚动起来) 简单设置数值即可
2020/03/20 jQuery
在win和Linux系统中python命令行运行的不同
2016/07/03 Python
Python内存管理方式和垃圾回收算法解析
2017/11/11 Python
Python实现判断字符串中包含某个字符的判断函数示例
2018/01/08 Python
Python使用smtp和pop简单收发邮件完整实例
2018/01/09 Python
攻击者是如何将PHP Phar包伪装成图像以绕过文件类型检测的(推荐)
2018/10/11 Python
基于wxPython的GUI实现输入对话框(1)
2019/02/27 Python
python SVM 线性分类模型的实现
2019/07/19 Python
Django restframework 框架认证、权限、限流用法示例
2019/12/21 Python
SISLEY希思黎官方旗舰店:享誉全球的奢华植物美容品牌
2018/04/25 全球购物
泰国网上购物:Shopee泰国
2018/09/14 全球购物
AVI-8手表美国官方商店:AVI-8 USA
2019/04/10 全球购物
行政助理的岗位职责
2014/02/18 职场文书
水利水电建筑施工应届生求职信
2014/07/04 职场文书
岗位工作说明书
2014/07/29 职场文书
城管年度个人总结
2015/02/28 职场文书
使用CSS实现音波加载效果
2023/05/07 HTML / CSS