美文网首页
js/jQuery中获取table里边checkbox的选中状态

js/jQuery中获取table里边checkbox的选中状态

作者: 飞走的光年 | 来源:发表于2020-03-04 09:05 被阅读0次

    js/jquery中获取table里边checkbox的选中状态以及选中该行的其他列数据
    如下是在js中通过DOM方式创建的row中的一列为CheckBox类型。

    var row = document.createElement('tr'); //创建行
    
    var checkbox = document.createElement('td');//创建列
    row.appendChild(checkbox);
    var btnCheckbox = document.createElement('input');
    btnCheckbox.setAttribute('name','ckb');
    btnCheckbox.setAttribute('type','checkbox');
    btnCheckbox.setAttribute('value','false');
    checkbox.appendChild(btnCheckbox);
    

    如我们在table之外有一个删除按钮,需要点击它删除table中选中的数据,而传给服务端的是某一列数据比如id。
    先判断是否选中,再根据选中的列获取id值,发送给服务端。

    $("#btnDelSpell").click(function () {
        var checkLength = $("input:checkbox[name='ckb']:checked").length;
        if(checkLength == 0) {
            alert("请至少选择一条咒语!");
            return;
        }
        $("input[type='checkbox']").each(function(){ //遍历checkbox的选择状态
             if($(this).prop("checked")){ //如果值为checked表明选中了
                 alert($(this).closest('tr').find('td').eq(1).text()); //获取eq为1的那一列数据
            }
        });
    }
    

    相关文章

      网友评论

          本文标题:js/jQuery中获取table里边checkbox的选中状态

          本文链接:https://www.haomeiwen.com/subject/fcsplhtx.html