layUI使用问题记录

211 阅读1分钟

1、layUI行单击事件与列单击事件冲突解决

//HTML代码
<div id="conTableInfo">
  <table class="layui-hide" id="conManager" lay-filter="conManager"></table>
</div>
//事件模板
<script type="text/html" id="barDemo">
  <a class="layui-check" lay-event="check">查看</a>
</script>
cols: [
          [
            {
              field: 'routeMarking',
              title: '详情',
              width: 80,
              align: 'center',
              toolbar: '#barDemo'//模板用法
            }
          ]
        ],
//监听行单击事件
$('#conTableInfo').on('click', 'div[lay-id="conManager"] .layui-table-body tr', function (e) {
  var that = $(this);
  var _obj = table.cache.conManager[parseInt($(this).attr('data-index'))];//获取当前行参数
})
//监听列点击事件
//routeMarking--当前列的field名字
$('#conTableInfo').on('click', 'td[data-field="routeMarking"]', function (e) {
  var _event = $(this).find('[lay-event]').attr('lay-event');
  var _obj = table.cache.conManager[parseInt($(this).parent('tr').attr('data-index'))]; //行内数据
  //循环遍历事件,执行对应的方法
  switch (_event) {
    case 'check':
     //这里写具体的代码
      break;
    default:
  }
  return false;
})