Question

我需要从第二个下拉菜单中删除一些选项。我已经尝试了很多迭代来完成它但仍然无法正常工作。请提供解决方案在下面的代码中，我需要从第一个中选择的第二个下拉列表中删除该选项。我试过上面提到的HTML＆amp; Javascript代码

HTML

<form>
        Source:
        <select id = "box1" name="a">
            <option>select</option>
            <option value="Apple">Apple</option>
            <option value="Banana">Banana</option>
            <option value="Carrot">Carrot</option>
        </select>   

        Destination:
        <select id="box2" name="b">
            <option>select</option>
            <option value="Apple">Apple</option>
            <option value="Mango">Mango</option>
            <option value="Dice">Dice</option>
            <option value="Carrot">Carrot</option>
         </select>
    </form>

JAVASCRIPT

    var main = function(){
       $("#box1").change(function(){
       var a = $('#box1 option:selected').val();
       $("#box2 option[value='a']").remove();
       });
    }
    $(document).ready(main);

我尝试将值作为变量a输入，带有和不带引号但没有效果。虽然当我取代＆＃39; a＆＃39;具有像Apple＆＃39;这样的特定值，那么代码就可以了。

Answer 1

我认为这是你的答案;）

var main = function(){
  $("#box1").change(function(){
    var a = $('#box1 option:selected').val();
    $("#box2 option[value="+a+"]").hide().siblings().show();
  });
}
$(document).ready(main);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="box1" name="b">
  <option>select</option>
  <option value="Apple">Apple</option>
  <option value="Mango">Mango</option>
  <option value="Dice">Dice</option>
  <option value="Carrot">Carrot</option>
</select>
<select id="box2" name="b">
  <option>select</option>
  <option value="Apple">Apple</option>
  <option value="Mango">Mango</option>
  <option value="Dice">Dice</option>
  <option value="Carrot">Carrot</option>
</select>

Answer 2

嗨请检查https://jsfiddle.net/RRR0308/uubuumrz/1/

<强> HTML

<select id="box1">
  <option>111</option>
  <option>222</option>
  <option>333</option>
  <option>444</option>
</select>

<select id="box2">
  <option>999</option>
  <option>222</option>
  <option>888</option>
  <option>444</option>
</select>

<强>的jQuery

$(document).ready(function(){
    $('#box1').on('change', function(){

    var x=$(this).val();

    $('#box2 option').each(function(){
        if($(this).val()==x){
        $(this).remove();

      }
    });
  });
});

Answer 3

隐藏（）。兄弟姐妹（）。显示（）instead of。除去（）`

.remove（）从box2中永久删除box1中的选定选项。所以如果你使用.hide（）和.show（），它会隐藏和显示。尝试做出这些改变。

Answer 4

$('#box1').change(function(){
  var v = $(this).val();
  $('#box2').find("option[value="+v+"]").remove(); });

试试这个简单的

下拉选项从其他下拉列表中删除

4 个答案: