javascript - 根据选择启用/禁用输入 (jQuery)

Question

<select name="state" class="select" id="state">
    <option value="something">Something</option>
    <option value="other">Other</option>
</select>

<input type="text" name="province" class="text" id="province" />

jQuery

$('#state').change(function () {
    if ($('#state Other:selected').text() == "Other"){
        $('#province').attr('disabled', false);
        alert(1);
    } else {
        alert(2);
    }
});

好像不行。我一定是做错了什么。

Answer 1

你应该使用 .removeAttr('disabled') 而不是 .attr('disabled', false) .你也应该 cache your jQuery selectors .

编辑:事后思考这个问题。如果禁用它，您可能希望“清空”输入到字段中的文本，因此我添加了 .val('')。 , 如果你也想隐藏它，你可以添加 .hide()和 .show()两种情况。

我放在一起this fiddle向您展示一个工作版本:

var $state = $('#state'), $province = $('#province');
$state.change(function () {
    if ($state.val() == 'other') {
        $province.removeAttr('disabled');
    } else {
        $province.attr('disabled', 'disabled').val('');
    }
}).trigger('change'); // added trigger to calculate initial state

.trigger('change') 将“触发”一个更改事件，在您绑定(bind)它时有效地运行该函数一次。这样，#province将根据运行代码时选择的状态禁用/启用。没有它，即使该州不是“其他”，该省也将可用，除非您还添加了 disabled='disabled'到 <input>在您的 html 中标记。