jquery - 当我选择上一个选项时，如何禁用选择选项字段？

Question

我有两个选择框，一个会选择功放，第二个会选择与之匹配的箱体。

我的问题是，如果选择了“放大器 2”，我需要在“机柜”选项中添加一个 disabled="disabled" 的值。

我尝试了一些选项，例如：

$("#amp option.grey-out option:selected").change() { 
   $("option.disable").attr("select[disabled='disabled']");
});

这是我的 HTML：

<select required="" autofocus="" id="amp" name="options" class="select-model">
    <option data-value="500">Amplifier 1</option>
    <option data-value="1000" class="grey-out">Amplifier 2</option>
</select>

<select required="" autofocus="" id="cab" name="options" class="select-model">
    <option data-value="100" class="disable">Cabinet 1</option>
    <option data-value="200" class="disable">Cabinet 2</option>
</select>

我在这里开始了一个 jsFiddle

Answer 1

看起来你需要这样的东西：

$("#amp").on('change', function () { 
  $("#cab").prop('disabled', $(this).val() == "Amplifier 2")
});

http://jsfiddle.net/gvalmon/shgfk/

有问题的更多细节可能有助于找到更好的解决方案。

Answer 2

像这样...？

$(document).ready(function () {
$('#amp').change(function () {
    var ampVal = $('#amp').val();
    if (ampVal == 'Amplifier 2') {
        $('#cab').attr('disabled', 'true');
    } else {
        $('#cab').removeAttr('disabled');
    }
});
});

jsfiddle