layui 双击,单击表格数据选中 颜色标记选中行

展示图

在这里插入图片描述
点击数据,标记

代码

操作的表格

    <div class="fp-table" style="width: 100%">
        <table id="hstable" lay-filter="hstool"></table>
    </div>

js


    layui.use(['form','table'], function() {
    
    //双击标记
        layui.table.on('rowDouble(hstool)', function(obj){  // 双击选中表格的数据,并标识
            // console.log(obj.tr) // 得到当前行元素对象
            // console.log(obj.data)
            // 添加当前行样式,然后移除兄弟样式
            // obj.tr.addClass('layui-bg-blue').siblings().removeClass('layui-bg-blue');
            obj.tr.addClass('layui-bg-orange').siblings().removeClass('layui-bg-orange');
        });

    })

//siblings()用于查找当前元素的同胞元素,就是拿到当前元素的兄弟节点(不包括自己)。
//给当前元素设置新的样式,并删除当前元素的同胞元素的样式:



或者


function fapztable(data) {
        //templet
        var table = layui.table;
        //第2个实例
        table.render({
            elem: '#hstable',
            height: h-60,
            /*width:w*0.45,*/
            size: 'sm', //小尺寸的表格
            page: false, //开启分页
            limits: [15, 30, 50,100,200,500,5000,10000,20000,50000],
            limit:20000,
            cols: [],
            data: data? data : [],
            filter:{
                bottom:false
            },
            done: function () {
                layui.soulTable.render(this)
            /*    $("[data-field='id']").css('display','none');*/

            }
        });
        //监听工具条
        table.on('tool(hstool)', function (obj) {
            var row = obj.data;
        });

//单击标记
        table.on('row(hstool)', function(obj){
            obj.tr.addClass('layui-bg-orange').siblings().removeClass('layui-bg-orange');
            var row = obj.data;
            selid=row.id?row.id:row.ID;
        })
    }


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值