LayUI Table 复选框获取选中的数据

原创于 2023-05-18 10:13:52 发布 · 5.2k 阅读

CC 4.0 BY-SA版权

文章标签：

该文章展示了如何使用JavaScript处理表格中的复选框事件。方法1涉及监听复选框状态，当用户选择时，将选中的stacode添加到数组，取消选择时从数组中移除。方法2利用table.checkStatus获取所有选中行的数据，并过滤出online状态的项，将其stacode加入数组。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

方法1 点击复选框 收集或者移除编号
//以下为复选框的相关操作
table.on('checkbox(container)', function (obj) {
        if (obj.checked) {
            //obj.type如果触发的是全选，则为：all，如果触发的是单选，则
            if (obj.type === "one") {
                mns.push(obj.data.stacode);
            } else {
                var datas = table.getData("table") // 例如 let data = table.getData('Table-List');
                $.each(datas, function (idx, item) {
                    mns.push(item.stacode);
                });
            }
        } else {
            if (obj.type === "one") {
                //获取cc在数组中所在的下标
                var index = jQuery.inArray(obj.data.stacode, mns);
                //从array中的第index元素开始删，删除的长度为1
                mns.splice(index, 1);
            } else {
                mns = [];
            }
        }
        console.log(mns.join(","));
    }
);

方法2 统一收集

var datas = table.checkStatus("table").data;
$.each(datas, function (idx, item) {
    if (item.online) {
        mns.push(item.stacode);
    }
});

LayUI Table 复选框 获取选中的数据

LayUI Table 复选框获取选中的数据