[分享]layui 自定义监听事件

在Layui中，自定义监听事件通常涉及到两个API：layui.onevent 和 layui.event。这两个API允许你为Layui的模块添加和触发自定义事件。添加自定义模块事件使用 layui...

在Layui中，自定义监听事件通常涉及到两个API：layui.onevent 和 layui.event。这两个API允许你为Layui的模块添加和触发自定义事件。

添加自定义模块事件

使用 layui.onevent 方法可以为Layui的模块添加自定义事件。这个方法通常在内置组件中使用，但也可以在自定义模块中使用。语法如下：

layui.onevent(modName, events, callback);

• modName 是模块名，例如 'form'。

• events 是事件名，可以是任意字符串，但建议使用点分隔的方式，如 'click(this)'。

• callback 是触发事件时执行的回调函数。

触发自定义模块事件

使用 layui.event 方法可以触发自定义模块事件。语法如下：

layui.event(modName, events, params);

• modName 是模块名。

• events 是事件名。

• params 是传递给回调函数的参数。

示例

假设你有一个表单模块，并且想要在提交时触发一个自定义事件，你可以这样做：

1. 定义模块并添加事件监听：

layui.use('form', function(){
  var form = layui.form;
  
  // 添加自定义事件监听
  form.on('submit(mySubmit)', function(data){
    console.log('自定义提交事件被触发', data);
    return false; // 阻止表单提交
  });
});

1. 触发自定义事件：

// 假设你有一个按钮，想要在点击时触发上面的自定义提交事件
layui.use(['form', 'layer'], function(){
  var form = layui.form;
  var layer = layui.layer;
  
  // 触发自定义事件
  $('#myButton').on('click', function(){
    form.event('submit', 'mySubmit', {
      // 可以传递一些额外的参数
    });
  });
});

在这个例子中，我们首先使用 form.on 方法监听了一个自定义的提交事件 mySubmit。然后，我们通过 form.event 方法触发了这个事件。注意，form.event 方法的 modName 参数是 'submit'，因为 form.on 方法在内部使用了 'submit' 作为模块名。

更多详细信息和用法，可以参考Layui的官方文档 。