Question

我尝试使用prop从HTML文档中删除disable属性，但由于某种原因它无法正常工作。这是我的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;

将隐藏类的显示更改为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{

    }
});
});

我面临的问题是，当我更改单击单选按钮“选择版本”时，jQuery代码不会删除“已禁用”属性。我读了一篇文章说喜欢prop（）而不是removeAttr（）请帮忙。

Answer 1

.form-field是<div> s且没有disabled属性。您需要选择<input>;例如，

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

jQuery onchange事件不会将HTML的禁用属性赋予false

1 个答案: