在Ajax POST後清除我的列表框

Question

我在使用JQuery和Ajax發佈的ListBox中顯示信息列表。實際上，我在另一個ListBox1中選擇一個值，單擊我的按鈕，然後顯示另一個ListBox2信息，以相應地顯示我在ListBox1中選擇的值。

但是，當我從Listbox1中選擇另一個值時，我想要刪除/替換ListBox2中的信息。在我的代碼中，它不斷添加信息。

我需要清除我的Listbox2，當我再次點擊我的按鈕！

這裏是我的代碼：

$('#btnList').click(function() { 
    var list = { 
     "ContainerName": $("#listContainer option:selected").val() 
    }; 
    $.ajax({ 
     type: "POST", 
     url: "http://localhost:49416/AzureService.svc/ListBlob", 
     data: JSON.stringify(list), 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     processData: true, 
     success: function (data) { 
      $.each(data, function (index, value) { 
       $('#listBlob').append($('<option>').text(value).val(index)); 
      }); 
     }, 
     error: function (data) { 
      alert("error"); 
     } 
    }); 
    return false; 
}); 

Answer 1

您可以.empty()追加收到：

success: function (data) { 
    $('#listBlob').empty(); // <---- clear all other prev options added. 
    $.each(data, function (index, value) { 
     $('#listBlob').append($('<option>').text(value).val(index)); 
    }); 
},