Question

我有一个复选框：

<input type="checkbox" id="catDescript" class="category_description" name="aisis_options[category_description]" value="category_description">

和文字区域

<textarea id="categoryHeader" class="input-xlarge" name="aisis_options[category_header_text]" rows="10" cols="100%"></textarea>

以及下面的Jquery，假设在单击复选框时禁用文本区域，只要单击复选框，两个就会禁用文本区域。

$("#catDescript").change(function() {
    if($(this).is(":checked")) {                
        $("#categoryHeader").attr("disabled", "disabled");
    }
    else {
        $("#categoryHeader").removeAttr("disabled");
    }
}); 

if ($('input[value=category_description]:checkbox:checked').attr('id') === "catDescript") {
    $('#categoryHeader').attr('disabled', 'disabled');
}

问题是，我单击复选框，文本区域不会被禁用。我单击提交复选框已选中但文本区域未被禁用。

我做错了什么？请发一个jsfiddle。

Answer 1

要修改元素的属性，应使用prop方法代替attr。

$(function() {
    $("#catDescript").change(function() {
        $("#categoryHeader").prop("disabled", this.checked);
    }).change(); // trigger the event on DOM Ready
})

文本区域未禁用或保持禁用状态

1 个答案: