Layui数据表格各种的事件
1、 监听⾏单击事件：
在layui数据表格渲染完成之后，我们可以通过 row 这个属性来监听表格中的⾏点击事件，其中（obj）中包含了你所点击的这⼀⾏的所有的属性和数据，可以设置⼀个data⽤来接收obj中的数据！
这样就可以获取到你所点击的⾏的所有的数据了，以及设置选中⾏的样式、勾选复选框等等的效果，也可以给这⼀⾏的数据的某⼀个值赋值给某⼀个标签$("#shoji").val(obj.data.ProvPhone)！
<('row(tabsupplier)', function (obj) {
var data = obj.data;//获取点击⾏数据
$("#gongyingshangmingcheng").val(obj.data.ProvisionCompany);//名称
$("#dianhua").val(obj.data.ProvPhone);
$("#lianxiren").val(obj.data.Contact);
$("#shoji").val(obj.data.ProvPhone);
});
2、 监听⾏双击事件：
双击事件的⽤法和上⾯的点击事件也是⼀样的，不同的只是 rowDouble 属性⽽已！还有勾选复选框和勾选单选框的⽤法也是⼀样的，只需要把checkbox 改成radio就可以了。
<('rowDouble(tabTitles)', function (obj) {
var data = obj.data;//获取点击⾏数据
var CommID = obj.data.CommID;
UpdateTemporayModels(CommID);
});
3、 ⼯具栏点击事件：
在设置⼯具栏的点击事件之前，我们需要先在静态表格中设置对应的lay-event='level’值，也可以在动态表格中的表头添加 event:
'levels’值，然后就可以给对应的⼯具栏的点击事件中编写需要执⾏的代码了！
<('tool(tabsizezu)', function (obj) {
var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
var tr = ; //获得当前⾏ tr 的DOM对象
if (layEvent === 'level'){……}
if (layEvent === 'levels'){……}
if (layEvent === 'Update'){……}
htmlradio添加切换事件});
4、 复选框点击事件：
Layui表格中的复选框默认是可以勾选，但是⼤多数时候我们需要的是勾选复选框之后的获取到相对应的值，所以我们就需要监听复选框的点击事件来获取相对应的值！
⾸先我们需要在layui表格加载和初始化的时候加载form元素：layui.use([‘layer’, ‘table’, ‘element’, ‘form’], function () {})，以及在相对应的复选框的标签内添加上（lay-filter=“formDemo”）属性；声明⼀个变量⽤来接收当前复选框的值var checkboxVail = $("#ToVoNo").val();
判断当前的值是true还是false，点击⼀下就改变当前的值，这样就可以实现复选框的值根据勾选状态⽽不断切换的效果！
<('checkbox(formDemo)', function () {
if (checkboxVail == 'true') {
$("#ToVoNo").val("false");
checkboxVail = $("#ToVoNo").val();
}
else if (checkboxVail == 'false') {
$("#ToVoNo").val("true")
checkboxVail = $("#ToVoNo").val();
}
})
5、 单选框点击事件：
在HTMl中的单选框的的标签内添加上lay-filter="bbb"属性，当然也需要在在layui表格加载和初始化的时候加载form元素！声明⼀个全局变量⽤来接收当前点击的单选框的值，也可以在⾥⾯放⼊需要点击单选框之后所执⾏的代码或者⽅法！
<('radio(bbb)', function () {
sex = $(this).val();
SizeStatistics();
})

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。