layui 处理按钮的点击事件方法
时间: 2023-12-14 12:22:25 浏览: 443
点击事件的处理
在layui中,可以通过给按钮添加lay-filter属性来绑定事件,然后通过监听form.on('submit(filter)', function(data){})方法来处理按钮的点击事件。具体步骤如下:
1. 给按钮添加lay-filter属性,如下所示:
```html
<button class="layui-btn" lay-filter="demo1">提交</button>
```
2. 监听按钮的点击事件,如下所示:
```javascript
layui.use('form', function(){
var form = layui.form;
//监听提交
form.on('submit(demo1)', function(data){
layer.msg(JSON.stringify(data.field));
return false;
});
});
```
在这段代码中,我们通过layui.use方法引入了form模块,并且通过form.on方法监听了按钮的点击事件。其中,第一个参数'demo1'就是我们在按钮上绑定的lay-filter属性值,第二个参数是一个回调函数,用来处理按钮的点击事件。
3. 在回调函数中处理按钮的点击事件,如下所示:
```javascript
form.on('submit(demo1)', function(data){
layer.msg(JSON.stringify(data.field));
return false;
});
```
在这段代码中,我们通过layer.msg方法弹出了一个提示框,显示了按钮点击时的表单数据。最后,我们通过return false来阻止表单的提交行为。
阅读全文