javascript - onclick 在视图中显示重复的 json 结果

Question

我有从我的控制器返回的数据，并且 thouse 结果在 js 中正确显示为 json，它在我的视图中附加 div 以显示这些数据。现在我有一个问题，每次点击 div 都会附加到 +1 行以显示相同的数据。如何在添加新 div 之前在单击操作时删除这些 div。

 success: function (result) {
            var data = null;
            $.each(result, function (i, item) {
                data = '<div>' + item.Id + ' ' + item.Title + '</div>';
                $("#tab-" + item.PropertyType).append(data);
            });

Answer 1

在添加一组新 div 之前，您可以删除所有父 div 名称以“tab-”开头的 div

success: function (result) {
        var data = null;
        $("[id^='tab-'] div").remove();
        $.each(result, function (i, item) {
            data = '<div>' + item.Id + ' ' + item.Title + '</div>';
            $("#tab-" + item.PropertyType).append(data);
        });

Answer 2

试试这个 ：

 success: function (result) {
        var data = null;
        $.each(result, function (i, item) {
            $("#tab-" + item.PropertyType).children('div').remove(); //remove any divs inside the tab 
            data = '<div>' + item.Id + ' ' + item.Title + '</div>';
            $("#tab-" + item.PropertyType).append(data);
        });

或：成功时替换选项卡的全部内容：

success: function (result) {
        $.each(result, function (i, item) {
            $("#tab-" + item.PropertyType).html('<div>' + item.Id + ' ' + item.Title + '</div>');
        });