深圳全飞鸿

标题: 关于layui的util.on('lay-on',{}) [打印本页]

作者: syant    时间: 2025-4-2 14:39
标题: 关于layui的util.on('lay-on',{})
util.on('lay-on',{})

在 layui 中,util.on('lay-on', {}) 这一方法通常用于监听自定义事件。layui.util 是 layui 提供的工具模块,允许你使用一些方便的方法来进行事件管理。util.on 用于绑定事件,lay-on 是事件的名称,通常你可以通过 util.on 来捕获和响应自定义的事件。
语法:
  1. layui.use('util', function(){
  2.   var util = layui.util;

  3.   // 监听 'lay-on' 事件
  4.   util.on('lay-on', function(e) {
  5.     console.log('lay-on event triggered', e);
  6.     // 你可以在这里处理事件
  7.   });
  8. });
复制代码
参数说明:





作者: syant    时间: 2025-4-2 14:41
示例应用:
假设你在页面中有一个按钮,当点击按钮时,你希望触发 lay-on 事件,可以通过 util.on 来监听并处理它。

1. 绑定事件:
  1. <button class="layui-btn" id="triggerEvent">触发事件</button>
复制代码
2. 使用 util.on 来监听和处理这个事件:
  1. <p>layui.use('util', function(){</p><p>  var util = layui.util;</p><p>
  2. </p><p>  // 监听 'lay-on' 事件</p><p>  util.on('lay-on', function(e) {</p><p>    console.log('lay-on event triggered', e);</p><p>    // 处理事件,执行某些操作</p><p>  });</p><p>
  3. </p><p>  // 给按钮绑定点击事件,触发 'lay-on' 事件</p><p>  document.getElementById('triggerEvent').addEventListener('click', function() {</p><p>    util.event('lay-on', { message: '按钮点击触发了 lay-on 事件' });</p><p>  });</p><p>});</p>
复制代码
解释:
当点击 "触发事件" 按钮时,会通过 util.event('lay-on', {...}) 手动触发 lay-on 事件。
util.on('lay-on', function(e) {...}) 用来监听这个事件,并执行回调函数。


作者: syant    时间: 2025-4-2 14:44
  1. <p><button class="layui-btn layui-btn-sm layui-btn-primary layui-border-blue" lay-on="searchForm"></p><p>                <i class="layui-icon layui-icon-search"></i></p><p>                <span>搜索添加点检表</span></p><p></button></p>
复制代码
  1. util.on('lay-on', {
  2.                 "searchForm": function (o) {
  3.                     if (macode == "") {
  4.                         layer.msg("请在【生产作业】页面扫描 机台代码", { icon: 2 });
  5.                         return false;
  6.                     }
  7.                     layer.open({
  8.                         type: 2,
  9.                         title: "搜索点检表",
  10.                         shade: 0.2,
  11.                         maxmin:true,
  12.                         shadeClose: true,
  13.                         area: ['65%', '90%'],
  14.                         content: '../L.php/spotcheck/formlist?macode=' + macode,
  15.                         end: function(){
  16.                             table.reload("currentTableId",{});
  17.                         }
  18.                     })
  19.                 }
  20.             })
复制代码







欢迎光临 深圳全飞鸿 (http://www.nagomes.com/disc/) Powered by Discuz! X3.2