删除 jQuery 中的下拉值答案

【问题标题】：Remove Dropdown Value in jQuery删除 jQuery 中的下拉值
【发布时间】：2012-09-25 14:33:21
【问题描述】：

每当勾选单选按钮 3 时，我都试图摆脱选项值 2，这是我根据我在类似问题中看到的内容得到的，但它似乎对我不起作用。

有什么建议吗？

<input name="options" type="radio" value="1" id="option1">
<input name="options" type="radio" value="2" id="option2">
<input name="options" type="radio" value="3" id="option3">

<select name="number" id="number">
<option value=""></option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option></select>

<script type="text/javascript">

    $(function(){
    $('#option3 input[type=radio][value=3]').attr('checked',true); 
        $("#number option[value='2']").remove()
});

</script>

非常感谢:)

【问题讨论】：

您想在单击配给按钮 3 时将其永久删除，还是您只想在单击单选按钮 3 时隐藏它，当您单击单选按钮 2 时它应该再次出现？

标签： jquery radio-button show-hide

【解决方案1】：

您应该监听更改事件，当前您正在尝试检查第三个单选按钮并删除 DOMReady 上的选项。

$(function(){
   $('input[name=options]').change(function(){
       if (this.id == 'option3') {
           $("#number option[value='2']").remove()
       }
   })
})

http://jsfiddle.net/rDp24/

在某些浏览器中您无法隐藏选项元素，您可以删除该选项并重新附加它，试试这个：

var option = '<option value="2">2</option>';
$('input[name=options]').change(function() {
    var $select = $("#number");
    if (this.id == 'option3') {
        $select.find("option[value='2']").remove()
    } else if (!$select.find("option[value='2']").length) {
        $select.append(option)
    }
})

http://jsfiddle.net/zszqs/

【讨论】：

这两种方法都有效，但是在选择选项 3 后，返回到其他选项之一，值 2 不会再次出现。
@undefined 新代码不起作用，当我将 .hide 更改为 .remove 时，它再次起作用但 .show 不起作用。我知道您需要为此使用 .remove，但不确定相反的选项应该是什么。
太棒了！感谢您的帮助！

【解决方案2】：

你可以使用

$('#option3').change(function(){
     if ($(this).is(':checked')) {
                $("#number option[value='2']").remove();
            }
   });
});

它会删除值

【讨论】：

如果我把括号留在最后一行的括号中，我会收到一个错误，当我把它们拿出来时它不起作用:(

【解决方案3】：

它会为你工作

$("#number option[value='2']").val('');

【讨论】：

这仍将保持option 完好无损（因此您仍然可以看到它）。我怀疑这是 OP 想要的吗？
它会正常工作，因为他希望在单击第二个单选按钮时删除下拉值

【解决方案4】：

http://jsfiddle.net/m3K2c/

这里有一个变体版本。

使单选按钮option3被选中将hide选项

选中其他单选按钮 (option1 & option2) 将再次选择 show。

【讨论】：

当我点击选项 3 时，值 2 不会消失。