在leyui table 表格中使用input控件并监听其事件

使用表格提供的属性templet去处理，不需要另外去画表格

html：

<table class="layui-hide" id="currentTable" lay-filter="currentTableFilter"></table>

js：

table.render({
　　elem: '#currentTable',
　　title: '课程大纲列表',
　　toolbar: '#toolbarDemo', //开启头部工具栏，并为其绑定左侧模板
　　cols: [[ //标题栏
　　{ field: 'number', title: '序号', width: 50, type: 'numbers' }
　　, { field: 'DaGangKeChengDaiMa', title: '大纲代码', width: 120 }
　　, { field: 'DaGangKeChengNeiRong', title: '大纲内容', minWidth: 250 }
　　, { field: 'DaGangXueShi', title: '大纲学时', minWidth: 100 }
　　, {
　　　　field: 'XueShi', title: '学时', width: 235, /*edit: 'number'*/ templet: (item) =>
　　　　{
　　　　　　var name = item.Id + "name";
　　　　　　var dmo = "<input lay-event='tabInput' type='number' value='" + item.XueShi + "' name='" + name + "' autocomplete='off' class='layui-input' id='" + item.Id + "' style='width: 200px; height: 28px; text-align: center; margin-left:20px;' />";
　　　　　　return dmo;
　　　　}
　　}
  ]],
　　data: data
});

//事件监听

使用data列表中的id去做控件的id绑定，用于事件监听。不管是获取值还是监听失去焦点的事件都可以直接用id定位控件。

//表格列表事件监听
table.on('tool(currentTableFilter)', function (obj)
{
　　var data = obj.data;
　　if (obj.event === "tabInput")
　　{
　　　　//点击了输入框
　　　　//监听输入框事件
　　　　$("#" + data.Id).blur(() => {
　　　　　　var value = $("#" + data.Id).val();

　　　　});
　　}
});