对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 相关文章推荐
我见过最全的个人js加解密功能页面
Dec 12 Javascript
利用404错误页面实现UrlRewrite的实现代码
Aug 20 Javascript
JS 对象介绍
Jan 20 Javascript
javascript中利用数组实现的循环队列代码
Jan 24 Javascript
JavaScript DOM学习第六章 表单实例
Feb 19 Javascript
JavaScript中常用的运算符小结
Jan 18 Javascript
js面向对象编程之如何实现方法重载
Jul 02 Javascript
基于Bootstrap实现下拉菜单项和表单导航条(两个菜单项,一个下拉菜单和登录表单导航条)
Jul 22 Javascript
Vue.js学习记录之在元素与template中使用v-if指令实例
Jun 27 Javascript
vue 项目常用加载器及配置详解
Jan 22 Javascript
微信小程序与后台PHP交互的方法实例分析
Dec 10 Javascript
微信小程序实现横向滚动导航栏效果
Dec 12 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
php自定义函数转换html标签示例
2016/09/29 PHP
PHP实现基于图的深度优先遍历输出1,2,3...n的全排列功能
2017/11/10 PHP
golang实现php里的serialize()和unserialize()序列和反序列方法详解
2018/10/30 PHP
File文件控件,选中文件(图片,flash,视频)即立即预览显示
2009/04/09 Javascript
判断客户浏览器是否支持cookie的示例代码
2013/12/23 Javascript
Jquery插件实现点击获取验证码后60秒内禁止重新获取
2015/03/13 Javascript
深入浅析Node.js 事件循环
2015/12/20 Javascript
Js查找字符串中出现次数最多的字符及个数实例解析
2016/09/05 Javascript
jQuery事件与动画基础详解
2017/02/23 Javascript
JavaScript字符串检索字符的方法
2017/06/23 Javascript
js获取地址栏参数的两种方法
2017/06/27 Javascript
前端图片懒加载(lazyload)的实现方法(提高用户体验)
2017/08/21 Javascript
jquery动态赋值id与动态取id方法示例
2017/08/21 jQuery
js控制随机数生成概率代码实例
2019/03/21 Javascript
echarts实现折线图的拖拽效果
2019/12/19 Javascript
[00:43]FTP典藏礼包 DOTA2三大英雄霸气新套装
2014/03/21 DOTA
[05:14]辉夜杯主赛事第二日 RECAP精彩回顾
2015/12/27 DOTA
python实现在pickling的时候压缩的方法
2014/09/25 Python
详解Python的Django框架中Manager方法的使用
2015/07/21 Python
Python+OpenCV人脸检测原理及示例详解
2020/10/19 Python
Python 实现12306登录功能实例代码
2018/02/09 Python
python基础教程项目四之新闻聚合
2018/04/02 Python
pandas groupby 分组取每组的前几行记录方法
2018/04/20 Python
Python使用matplotlib和pandas实现的画图操作【经典示例】
2018/06/13 Python
pandas实现to_sql将DataFrame保存到数据库中
2019/07/03 Python
python SVM 线性分类模型的实现
2019/07/19 Python
Python pyautogui模块实现鼠标键盘自动化方法详解
2020/02/17 Python
Django创建一个后台的基本步骤记录
2020/10/02 Python
详解CSS3伸缩布局盒模型Flex布局
2018/08/20 HTML / CSS
amazeui时间组件的实现示例
2020/08/18 HTML / CSS
通息工程毕业生自荐信
2013/10/16 职场文书
应付会计岗位职责
2013/12/12 职场文书
公司年会主持词
2014/03/22 职场文书
2014年入党积极分子党校培训心得体会
2014/07/08 职场文书
签证工作证明模板
2015/06/15 职场文书
三国演义读书笔记
2015/06/25 职场文书