JQuery删除行最多允许totalrows-1

Question

我在 jQuery 中有一个带有添加和删除功能的动态 table:

我正在使用以下方法删除行：

$("#DEL").click(function(){
    $("table tr input:checked").parents('tr').remove();
});

Fiddle: FIDDLE

如何避免同时删除所有列。我的意思是如果用户选中所有行并单击删除，它应该显示一条警告消息。 应该允许最多删除 totalrows-1

Answer 1

您可以使用 jquery 的 size() 函数来计算选中输入的行数，并与总行数进行比较。

$("#DEL").click(function(){
    var checked = $("table tr input:checked").size();
    var total = $("table tr").size();
    if (checked < total) {
        $("table tr input:checked").parents('tr').remove();
    } else {
        alert("You cannot delete all rows!");
    }
});

查看更新后的 fiddle here。

Answer 2

尝试添加检查 .length 个 tr 个元素

  $("#DEL").click(function () {
    console.log($("table tr input:checked").length)
    if ($("table tr").length === 1 
       || $("table input:checked").length === $("table tr").length) {
        alert("cannot delete last tr")
    } else {
        $("table tr input:checked").parents('tr').remove();
    }
  });

jsfiddle http://jsfiddle.net/qN2Z8/72/

Answer 3

这将完全按照你想要的方式工作，只要不是所有的行都被选中，它就会删除每个被选中的行，如果所有被选中，第一个将保持未删除状态JSFiddle

$("#ADD").click(function(){
    $("table").append($("tr:last").clone(true));
    $("tr:last input").val("");
});

$("#DEL").click(function(){
    var totalRows = $("table tr").length;
    var totalRowsChecked = $("table tr input:checked").length;
    if(totalRows == totalRowsChecked){
        $("table tr:not(:first) input:checked").parents('tr').remove();
    }else{
        $("table tr input:checked").parents('tr').remove();
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<BUTTON ID="ADD">ADD</button>
<BUTTON ID="DEL">DELETE</button>
<TABLE>
    <TR>
        <TD>
            <INPUT TYPE='CHECKBOX' />
        </TD>
        <TD>
            <INPUT TYPE='TEXT' CLASS='MYTEXT'/>
        </TD>
        <TD>SOMETHING</TD>
    </TR>
</TABLE>

更新： 在检查所有行的情况下显示警报：

$("table tr:not(:first) input:checked").parents('tr').remove();

应该改成这样：

alert("Sorry, cannot delete all rows");

JQuery删除行最多允许totalrows-1

JQuery delete rows allow a maximum of totalrows-1

jquery

html-table

delete-row