默认情况下禁用表单输入.点击<a>启用它们.禁用onClick不同的<a>

Question

基本上我希望在单击"编辑配置文件"按钮之前禁用所有表单输入,然后单击"保存更改"按钮后,重新应用禁用的属性.

我试过这个网站的一堆解决方案,没有运气.任何帮助将不胜感激,即使它只是指导我正确的方向.

这是代码,它使用bootstrap并包含Django(显然未显示).提前致谢.

<div class="main">
    <div class="container">
        <section class="hgroup">
            <h1>My Profile</h1>
            <h2>View and edit your profile.</h2>
            <ul class="breadcrumb pull-right">
                <li><a href="../dashboard">Dashboard</a> </li>
                <li class="active">Profile</li>
            </ul>
        </section>
        <section>
            <div class="row">
                <div class="contact_form col-sm-12 col-md-12">
                    <form name="contact_form" id="contact_form" method="post">
                        <div class="row">
                            <div class="col-sm-4 col-md-4">
                                <label>First Name</label>
                                <input name="first_name" id="name" class="form-control" type="text" value="">
                            </div>
                            <div class="col-sm-4 col-md-4">
                                <label>Middle Name</label>
                                <input name="middle_name" id="email" class="form-control" type="text" value="">
                            </div>
                            <div class="col-sm-4 col-md-4">
                                <label>Last Name</label>
                                <input name="last_name" id="email" class="form-control" type="text" value="">
                            </div>
                        </div>
                        <div class="col-sm-12 col-md-12">
                            <br/>
                            <a id="submit_btn" class="btn btn-primary" name="submit">Edit Profile</a>
                            <a id="submit_btn" class="btn btn-primary" name="submit">Save Changes</a>
                            <!--<span id="notice" class="alert alert-warning alert-dismissable hidden" style="margin-left:20px;"></span>-->
                        </div>
                    </form>
                </div>
            </div>
        </section>
    </div>
</div>

Answer 1

您还有两个具有 id 的元素submit_btn， id 应该是唯一的。

我会将它们更改为不同的，然后尝试：

$("#edit_btn").on('click', function() {
    $("input[type='text']").removeAttr('disabled');
});

然后重新禁用：

$("#submit_btn").on('click', function() {
    $("input[type='text']").attr('disabled', 'disabled');
});

input[type='text']如果您不想禁用页面上的更多输入，您可能希望更改选择器。

也许更改您的<input>元素以包含该类js-disable，然后定位$(".js-disable")选择器而不是input[type='text']