Layui点击行事件和点击复制单个数据示例

1:点击行事件

    table.on('row('+表格容器id+')',function (d){
        //d是数据
    })

2:点击某个字段数据处理

Column加一个事件的参数
{title: '用户名', field: 'username', templet: function (d) {
                    return '<div class="click-field" style="color: #673ab7" lay-event="clickUsername">' + d.username + '</div>';
                },visible: true, align: 'center', valign: 'middle'},
            {
                title: '密码', field: 'password', templet: function (d) {
                    return '<div class="click-field" style="color: #673ab7" lay-event="clickPassword">' + d.password + '</div>';
                }, visible: true, align: 'center', valign: 'middle'
            },

在事件处理器中,直接判断

    // 点击事件
    table.on('tool(' + serviceInfo.tableId + ')', function (obj) {
        let data = obj.data;
        let layEvent = obj.event;if(layEvent === 'clickUsername'){
           autoCopy(data.username,'用户名')
        }

        if(layEvent === 'clickPassword'){
            autoCopy(data.password,'密码')
        }
    });

复制处理

  function autoCopy(content,field) {
        if(!content){
            return ;
        }
        let element = document.createElement("input");
        element.value = content;
        document.body.appendChild(element);
        element.select();
        document.execCommand("Copy");
        element.className = "auto-copy-class";
        document.getElementsByClassName("auto-copy-class")[0].remove();
        layer.msg("复制["+field+"]成功!", {icon: 1});
    }

 

posted @ 2024-01-24 10:34  鸭猪是的念来过倒  阅读(200)  评论(0编辑  收藏  举报