禁用基于值的选择选项*仅通过 HTML！*答案

【问题标题】：Disable select options based on value *through the HTML only!*禁用基于值的选择选项*仅通过 HTML！*
【发布时间】：2011-11-19 00:08:15
【问题描述】：

我需要禁用基于变量值的选择选项。该值类似于选择选项值之一，需要禁用。

例如，

<select>
<option>Value a</option>
<option>Value b</option>
</select>

$variable = <some select option value>;

因此，如果变量等于值 a，则需要在选择选项中禁用它。

谢谢。

【问题讨论】：

标签： jquery html select

【解决方案1】：

使用您当前的标记，这将起作用：

$("select option:contains('Value b')").attr("disabled","disabled");

http://jsfiddle.net/CtqC6/

编辑

http://jsfiddle.net/CtqC6/1/

var variable = "b"
$("select option:contains('Value " + variable + "')").attr("disabled","disabled");
$("select").prop("selectedIndex",-1)

【讨论】：

如何添加变量而不是 Value b ，如果第一个选项设置为禁用，则只有在用户单击选择菜单时才会禁用。
您可以通过使用变量构建构造函数来使其动态化（请参阅我的编辑）。此外，禁用所选项目有效，它只是不会取消选择所选项目（也在我的编辑中）。

【解决方案2】：

$("select option[value='"+ $variable + "']").attr('disabled', true);

【讨论】：

【解决方案3】：

这应该是一个更快的解决方案

$('select').children('option[value="' + $variable + '"]').attr('disabled', true)

【讨论】：

【解决方案4】：

假设您有以下标记

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

使用这个 jQuery，saab 选项将被禁用。

$("select option").each(function() {
    var $thisOption = $(this);
    var valueToCompare = "saab";

    if($thisOption.val() == valueToCompare) {
        $thisOption.attr("disabled", "disabled");
    }
});

Try it out here

【讨论】：