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

3zz*_*zzy 14 html javascript css jquery

<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" />
Run Code Online (Sandbox Code Playgroud)

jQuery的

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

似乎没有用.我一定做错了什么.

gna*_*arf 37

你应该使用.removeAttr('disabled')而不是.attr('disabled', false).你也应该缓存你的jQuery选择器.

编辑:事后想到这个.你可能想,如果你禁用它已被输入到现场"空"的文字,所以我加了.val(''),如果你也想隐藏它,你可以添加.hide().show()在两种情况.

我把这个小提琴放在一起,向你展示一个工作版本:

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
Run Code Online (Sandbox Code Playgroud)

.trigger('change')会"触发"的变化情况,有效运行的功能,一旦当你绑定.这样,#province将根据代码运行时选择的状态禁用/启用.没有它,即使状态不是"其他",该省也将可用,除非您还添加disabled='disabled'<input>HTML中的标记.

  • @WmasterJ - 添加了一些解释 (2认同)