用于删除表行的jQuery

时间:2013-08-24 08:38:43

标签: javascript

我有一些javascript用于检查表是否与select选项中的行数相同,如果没有则删除那些行,所以我写了以下内容:

$(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>

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

2 个答案:

答案 0 :(得分:0)

-Update -

演示: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;
}
});

答案 1 :(得分:0)

我不明白在您根据select值在for循环中追加行时,额外行的可能性在哪里。

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

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