jquery - 使用 jquery 在按钮单击时启用和禁用表单

Question

我正在使用 jquery 和 jquery mobile，基本上我正在尝试创建一个编辑按钮。我有一个包含用户信息的表单，默认情况下全部设置为禁用。我想在单击编辑按钮时启用表单，然后在单击保存按钮时禁用表单。这是表格：

<div data-role="fieldcontain">
            <label for="first_name">First Name:</label>
            <input type="text" name="first_name" id="first_name" value="" placeholder="First Name" disabled />
        </div>

        <div data-role="fieldcontain">
            <label for="last_name">Last Name:</label>
            <input type="text" name="last_name" id="last_name" value="" placeholder="Last Name" disabled />
        </div>

        <div data-role="fieldcontain">
            <label for="user_name">User Name:</label>
            <input type="text" name="user_name" id="user_name" value="" placeholder="User Name" disabled />
        </div>

        <div data-role="fieldcontain">
            <label for="password">Password:</label>
            <input type="text" name="password" id="password" value="" placeholder="Password" disabled />
        </div>

        <div data-role="fieldcontain">
            <label for="email">Email Address:</label>
            <input type="text" name="email" id="email" value="" placeholder="Email Address" disabled="disabled" />
        </div>

这是我的按钮：

 <button data-inline="true" id="edit">Edit</button>
 <button data-inline="true">Save</button>

这是我一直在玩的jquery：

$(document).ready(function(){
    $('#input:edit').click(function)(){
        $('input:email').attr("disabled", false);
    }
});

我注意到的一件事（可能是问题的一部分）是，即使我将文本输入的代码从禁用更改为启用，即使在我刷新页面后它们仍保持禁用状态，我必须回到我的主页，刷新，然后导航到用户信息页面以启用它们。因此，如果页面正确更新，我尝试过的一些事情可能是正确的。任何帮助表示赞赏。

Answer 1

这应该有效：

$(document).ready(function(){
    $('#input:edit').click(function)(){
        $('input:email').attr("disabled", "");
    }
});

Answer 2

尝试

$(document).ready(function(){
$('#edit').click(function)(){
    $('#email').attr("disabled", false);
}
});

Answer 3

你应该使用$('input:email').textinput('enable');

jQuery Mobile 文本输入方法

Answer 4

好的，想通了。将 jquery 代码更改为：

function edit() {
    alert("edit");
    $('#first_name').prop('disabled', false);
    $('#last_name').prop('disabled', false);
    $('#user_name').prop('disabled', false);
    $('#password').prop('disabled', false);
    $('#email').prop('disabled', false);
    location.reload();
}

和按钮代码：

 <button data-inline="true" id="edit" onclick="edit()">Edit</button>
 <button data-inline="true" id="save" onclick="save()">Save</button>