layui admin table单击行勾选checkbox并当前行变色

1.HTML部分

   <table class="layui-table" id="menu" lay-filter="menu-filter">
      <thead>
         <tr>
             <th lay-data="{type:'checkbox',fixed: 'left'}"></th>
             <th lay-data="{field:'menuid',width:150,align:'center',fixed: 'left'}">菜单ID</th>
             <th lay-data="{field:'menuname',width:130,align:'center'}">菜单名称</th>
             <th lay-data="{field:'supMenu',width:130,align:'center'}">上级菜单</th>
             <th lay-data="{field:'icon',width:100,align:'center',templet: iconTpl}">图标</th>
             <th lay-data="{field:'type',width:100,align:'center',templet: typeTpl}">类型</th>
             <th lay-data="{field:'sortNum',width:150,align:'center',sort: true}">排序号</th>
             <th lay-data="{field:'munuUrl',width:250,align:'center'}">菜单URL</th>
             <th lay-data="{field:'access',width:250,align:'center'}">授权标识</th>
          </tr>
       </thead>
    </table>

2.js部分

	//class样式
	.layui-table-click{
	    background-color:#ddf2e9 !important;
	}
	
	//监听行单击事件
    table.on('row(menu-filter)', function(obj){
     //动态添加背景色
      if(obj.tr.hasClass('layui-table-click')){
        obj.tr.removeClass('layui-table-click');
      }else{
        obj.tr.addClass('layui-table-click');
      }
      
      var index = obj.tr.data('index');
      var tableData = table.cache.menu;//menu 是表格id
      var trHasClass =  obj.tr.hasClass('layui-table-click');
      
       //循环判断class,选中checkbox
      layui.each(tableData, function(i, item){
        if(trHasClass == true){
          if(index == i){
            item.LAY_CHECKED = true;
          }
        }else{
          if(index == i){
            item.LAY_CHECKED = false;
          }
        }
      });
    });

3.效果图