jQuery onchange 事件不会将 HTML 的 disabled 属性设置为 false

Question

我尝试使用 prop 从 HTML 文档中删除禁用属性，但由于某种原因它不起作用。这是我的 HTML

<form>

<div class="form-group">
<label class="form-label">Select Type</label>
<div class="form-field">
<input type="radio" name="estimate-type" id="estimate-type" value="publication">Publication 
<input type="radio" name="estimate-type" id="estimate-type" value="package">Package
</div>
</div>

<div class="form-group hidden">
<label class="form-label">Select Editions</label>
<div class="form-field">
<input type="radio" name="publication-type" id="publication-type" value="all" checked>All Editions
<input type="radio" name="publication-type" id="publication-type" value="manual">Select Editions
</div>
</div>

<div class="form-group hidden" id="editions">
<label class="form-label"></label>
<div class="form-field">
<input type="checkbox" name="edition-mumbai" id="edition-mumbai" value="mumbai" checked disabled>Mumbai
<input type="checkbox" name="edition-delhi" id="edition-mumbai" value="delhi" checked disabled>Delhi
<input type="checkbox" name="edition-chennai" id="edition-chennai" value="chennai" checked disabled>Chennai
<input type="checkbox" name="edition-calcutta" id="edition-calcutta" value="calcutta" checked disabled>Calcutta
</div>
</div>

<div class="form-group">
<label class="form-label"></label>
<div class="form-field">
<button type="button" name="select-estimate-type" id="select-estimate-type">Proceed</button>
</div>
</div>

<div id="publication-estimate">
<div class="form-group">
<label class="form-label">Select Type</label>
<div class="form-field">
Publication 
</div>
</div>
</div>

<div id="package-estimate">
Package
</div>
</form>

我现在唯一使用的 CSS 是使用 display:none;

将隐藏 class 的显示更改为 none

jQuery代码是

$(document).ready(function(){
$("#estimate-type").on('change', function(){
    if ($(".form-field").find('input[value=publication]').prop('checked')){
        $(".hidden").show();
    }
    else{
        $(".hidden").hide();
    }
});
$("#select-estimate-type").on('click', function(){
    if ($(".form-field").find('input[value=publication]').prop('checked')){
        $("#publication-estimate").show();
        $("#package-estimate").hide();
    }
    else{
        $(".hidden").hide();
        $("#package-estimate").show();
        $("#publication-estimate").hide();
    }
});
$("#publication-type").on('change', function(){
    if ($(".form-field").find('input[value=manual]').prop('checked')){
        $(".form-field input").prop('disabled', false);
    }
    else{

    }
});
});

我面临的问题是当我更改单击单选按钮 "Select Editions" 时，jQuery 代码没有删除 'disabled' 属性。我读过一篇文章说更喜欢 prop() 而不是 removeAttr() 请帮忙。

Answer 1

.form-field 是 <div> 并且没有 disabled 属性。您需要 select 代替 <input>；例如，

$(".form-field input").prop('disabled', false);

jQuery onchange 事件不会将 HTML 的 disabled 属性设置为 false

jQuery onchange event won't prop disabled attribute of HTML to false

jquery

onchange