Question

我有此位的代码而使用显示从XML提要一些地方AJAX：

它显示正确，但

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