jquery select options刪除初始選項，並用其他替換

Question

我有下面的一塊jquery，它通過ajax向選擇輸入添加了新的選項。然而，選擇最初有一個選項，我想要刪除，然後用通過ajax返回的選項替換。

$(document).ready(function() { 
    $('#id_previous_postcode').change(function() { 
    var postcode = $(this).val() 
    console.log(postcode) 
    $.ajax({ 
     // could prevent url hard coding by using url tag in form widget attribute and assign url key here to that attr 
     url: '/users/prior_addresses_ajax/', 
     data: { 
     'postcode': postcode 
     }, 
     dataType: 'json', 
     success: function (data) { 
     var select = document.querySelector('#id_previous_full_address'); 
     console.log(data) 
     data.property_choices.forEach(function (subarray) { 
      var option = new Option(subarray[1], subarray[0]); 
      select.options.add(option); 
     }); 
     } 
    }) 
    }) 
}) 

Answer 1

由於您使用的是jQuery，因此您可以選擇.empty()。

success: function (data) { 

     // Will remove previous set options from select 
     $('#id_previous_full_address').empty(); 

     var select = document.querySelector('#id_previous_full_address'); 
     console.log(data) 
     data.property_choices.forEach(function (subarray) { 
      var option = new Option(subarray[1], subarray[0]); 
      select.options.add(option); 
     }); 
     } 

Answer 2

我建議使用

$("SELECTOR").first().detach(); 

然後......

$("NEW ELEMENT").preppendTo($("SELECTOR").first().parent());