如何刷新jQuery的列表javascript

Question

嗨，我有一個頁面有一個文本框命名搜索和一個搜索按鈕。當我第一次搜索任何東西時，它會向我顯示正確的數據，但是當我在下一次搜索其他東西時，之前列出的元素也會附加到新列表的下方。假設我正在通過k搜索州名，它會給我一個卡納塔克邦，喀拉拉邦的正確名單。但是，如果我開始再次搜索g，它會顯示我輸出爲goa，gujrat，karnataka kerala。我嘗試使用刷新選項，但它仍然無法正常工作。這是我的js代碼

$.each(response.state, function (i, state) { 
$('#statelist').append(

       '<li>' + 
        '<a href="#">' 
        + 
         +'<b>'+ '<font color="green">'+'<h3>'+ state.Name +'</h3>'+'</font>' +'</b>'+ 

        '</a>' + 
       '</li>' 
      ); 
     }); 
     $('li img').width(100); 


    $('.ui-li-icon li').click(function() { 
    var index = $(this).index(); 
    text = $(this).text(); 
    // alert('Index is: ' + index + ' and text is ' + text); 
}); 
$("#statelist").listview("refresh"); 

，這是HTML

Answer 1

您正在使用.append（）函數。它追加任何你追加到列表的末尾。 查看該鏈接： http://api.jquery.com/append/

嘗試使用DOM模型的innerHTML屬性。

Answer 2

您可以添加

If(!('#statelist').html() == ""){ 
    $(this).remove(); 
    //execute rest of code that appends state list 
} 

然後做一個else語句不除去執行的追加代碼（）

UPDATE：一個更好的選擇是做這個 -

$.each(response.state, function (i, state) { 
$('#statelist').html(

      '<li>' + 
       '<a href="#">' 
       + 
        +'<b>'+ '<font color="green">'+'<h3>'+ state.Name +'</h3>'+'</font>' +'</b>'+ 

       '</a>' + 
      '</li>' 
     ); 
    }); 
    $('li img').width(100); 


$('.ui-li-icon li').click(function() { 
var index = $(this).index(); 
text = $(this).text(); 
// alert('Index is: ' + index + ' and text is ' + text); 
});