javascript - 用于删除表格行的jQuery

Question

我有一些javascript来检查表是否与选择选项中的行数相同，如果没有，则删除这些行，所以我写了以下内容：

$(document).ready(function() {
    $("#noOfSegments").change(function() {
        var counter = $("#noOfSegments").val();

        for (i = 0; i < counter; i++) {
            var row = $("<tr><td>" + i + "</td><td>" + i + "</td><td>" + i + "</td><td>" + i + "</td><td>" + i + "</td></tr>");

            $("#segmentTable").append(row);
        }

        if (segmentTable.rows.length > counter) {
            var rowLen = segmentTable.rows.length;
            var delIndex = 1;

            for (i = 0; i <= rowLen; i++) {
                if (i > counter) {
                    segmentTable.deleteRow(i - delIndex);
                    delIndex++;
                }
            }
        }
    });
});

<select id="noOfSegments">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

是我的表ID ，#segmentTable但我想要一些jQuery代码来做同样的事情，你能帮我写吗？提前致谢。

Answer 1

-更新-

演示：http: //jsfiddle.net/C7Ygh/

js：

$("#noOfSegments").change(function(){
    var count = $("#noOfSegments").val();
    var rowcount = $("#segmentTable tr").length;
    while (rowcount > count) {
    $("#segmentTable tr:last-child").remove();
    rowcount = $("#segmentTable tr").length;
}
});

Answer 2

我不明白额外行的机会在哪里，因为您根据select值在 for 循环中附加行。

但是如果要删除额外的元素，请根据计数器检查额外添加的元素数量并将其删除。

  var counter = $('#noOfSegments').val(), 
      Rows = $("#segmentTable > tr");
  if(Rows.length > counter){
      Rows.slice(counter - Rows.length).each(function(){
          $(this).remove();
      });
  }