Question

我有一个页面，其中有两个链接 - 已注册和已完成。单击可创建包含相关数据的表。单击该按钮时，需要从页面中删除当前表，并创建新表（通过Javascript）并附加。出于某种原因，.remove()和.empty()无法处理动态创建的表。已注册和已完成的链接始终存在于页面上。

HTML：

<body>
    <a id="completed" class="btn" title="Completed">Completed</a>
    <a id="enrolled" class="btn" title="Enrolled">Enrolled</a>
    <div id="table_container">
        <table id="courses_table"></table>
    </div>
</body>

使用Javascript：

$(document).ready(function() {
    $("a[class*=btn]").click(function(e) { 
        display_type = this.id; 

        getTags(display_type);

        e.preventDefault();
    }); 
});

function getTags(type) {
    $('#courses_table').remove();

    //ajax call to get data, create string of new table html, append it to the container div
    var table_data = '<table id="courses_table">...</table>';

    $('#table_container').append(table_data);
}

我已经尝试将.remove()移动到click事件或成功函数中，并删除整个包含div，但没有快乐。附加没有问题。我确信这很简单，我很想念。

编辑：#table_container.children()的console.log为[img images/calendars.png, div.width-100, table#courses_table]。

#courses_table的console.log让我[table#courses_table]。如果我正确地解释这些结果，表格就存在了，所以我回到原因，因为它没有被删除。

编辑第二个：我忘了提到我要删除的表有多个tbody标签。也许这会导致问题？我确实在删除之前尝试清空表，但它没有用。

这是一个显示我所看到的内容的小提琴：http://jsfiddle.net/c4Y3U/13/

Answer 1

而不是使用

id="courses_table"

使用

class="courses_table"

当然会相应地更新jQuery选择器，请参阅http://jsfiddle.net/c4Y3U/22/

JQuery - 使用静态链接删除动态创建的表

1 个答案: