如何动态删除选定的选项

Question

我想弄清楚用户选择它后删除选项的Jquery。

<select id="field4" name="ProductRankingAtHome" style="width: 30%"> 
    <option value="">-Please Select-</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
</select> 
<select id="field5" name="ProductRankingAtWork" style="width: 30%"> 
    <option value="">-Please Select-</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
</select> 
<select id="field6" name="ProductRankingInCar" style="width: 30%"> 
    <option value="">-Please Select-</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
</select> 

所以，有人选择 “1” 之后，从 “字段4”， “1” 将不会出现在字段5-等。

我想：

$ document.getElementById("field4").addEventListener("change", function (select) { 
    if (this.value != "") { 
     var select2 = document.getElementById("field5"); 
     for (var i = 0; i < select2.options.length; i++) { 
      if (this.value == select2.options[i].value) { 
       select2.options[i] = null; 
       break; 
      } 
     } 
    } 
}, false); 

Answer 1

使用.remove()上options

select2.remove(i); //i is the index of the option value you wish to remove 

Answer 2

事情是这样的 -

$("#field4").on('change',function(){ 
if(this.value != ''){ 
    $("#field5 option[value='"+this.value+"']").remove(); 
} 
}); 

Answer 3

试试这个：

$("option").on("click",function(){ 
    var value=$(this).val(); 
    $("option[value='"+value+"']").each(function(){ 
     $(this).remove(); 
    }); 
}); 

看Here

Answer 4

什么其他人说一起去。这是选定更改后删除ddl中的第一项，以模拟占位符

$('#ddl').change(function() { 
        if ($(this).val() != '') { 
         var firstChild = $(this).children().eq(0); 
         if (firstChild.attr('value') == '') { 

          firstChild.remove(); 

         } 
        }      
       });