Question

我有多个html表，每个表都有可变行数。

每行都有一个下拉列表元素。当该元素发生变化时，我想删除该表中的所有行。

我试过了：

$(document).on('change', '.classofmydropdownlist', function () {

    var self = $(this);
    var thisTable = self.closest('table')
    var rows = thisTable.children('tbody').children('tr');
    rows.each(function (element) {
        $(element).remove();
    });
    $.get('/Fetchmoreitems', { 'type': self.val() }, function (html) {        
        thisTable.append(html);
    });

}

但是行不会删除（尽管$ .get成功附加的新项目会附加）

Answer 1

问题是因为each()处理程序的第一个参数是匹配集中元素的索引，而不是对元素本身的引用 - 这是第二个参数：

rows.each(function (i, element) { // note 'i' here
    $(element).remove(); // or just $(this).remove() if you don't want to use any params
});

另请注意，您可以使用empty()：

简化逻辑

$(document).on('change', '.classofmydropdownlist', function () {
    var $self = $(this);
    var $tbody = self.closest('table').children('tbody').empty();

    $.get('/Fetchmoreitems', { 'type': self.val() }, function(html) {        
        $tbody.append(html);
    });    
});

Answer 2

thisTable.empty();

应删除所有行

Jquery从最近的表中删除所有行

2 个答案: