Question

我有一些代码，它使用AJAX显示来自XML Feed的一些位置：

$.ajax({
    type: "GET",
    url: "testxml.xml",
    dataType: "xml",
    success: function(xml) {
        $(xml).find("Country[Name='"+localStorage.ArrivalCountry+"']").find('Destination').each(function(){
            var destinationName = $(this).attr('Name');
            $('<a class="listItem" href="#" id="'+destinationName+'">'+destinationName+x+'<div class="arrow"></div></a>').appendTo('#destinationList');
        });

    }
});

第一次正确显示但如果我刷新页面则会显示两次结果。如果我再次这样做，它会显示三次，依此类推。

Answer 1

在添加更新后的集合之前，您需要empty()来自#destinationList的以前的AJAX调用数据：

$.ajax({
    type: "GET",
    url: "testxml.xml",
    dataType: "xml",
    success: function(xml) {
        $("#destinationList").empty(); // This will clear out all the previously appended 'a' elements
        $(xml).find("Country[Name='"+localStorage.ArrivalCountry+"']").find('Destination').each(function() {
            var destinationName = $(this).attr('Name');
            $('<a class="listItem" href="#" id="'+destinationName+'">'+destinationName+x+'<div class="arrow"></div></a>').appendTo('#destinationList');
        });
    }
});

有关empty()

的更多信息

AJAX - 页面刷新的双重结果

1 个答案: