Question

我有一个HTML表单，其中包含一些表单字段。

我的标记类似于此 -

<form>
  <div class="form-group">
    <label for="exampleInputEmail1">First Name</label>
    <input type="text" class="form-control" placeholder="First Name">
  </div>
  <div class="form-group">
    <label for="exampleInputPassword1">Email address</label>
    <input type="email" class="form-control"  placeholder="Enter email">
  </div>
  <button type="submit" class="btn btn-default">Submit</button>
</form>

我的问题是，我希望将第二个表单字段保持为非活动状态（在此表单中为`email field），直到第一个表单字段正确填写为止。非活动用户不能在那里输入或粘贴任何东西。

任何人都可以在jquery中告诉这是否可能，如果是这样告诉我如何？

希望有人能指导我改正道路。谢谢。

Answer 1

将禁用的属性添加到电子邮件并在名称密钥上启用/禁用

HTML

<form>
    <div class="form-group">
        <label for="exampleInputEmail1">First Name</label>
        <input type="text" class="form-control name" placeholder="First Name">
    </div>
    <div class="form-group">
        <label for="exampleInputPassword1">Email address</label>
        <input type="email" class="form-control email" placeholder="Enter email" disabled>
    </div>
    <button type="submit" class="btn btn-default">Submit</button>
</form>

的jQuery

$(function () {
    $('input.name').keyup(function () {
        if ($(this).val()) {
            $('input.email').removeAttr('disabled');
        } else {
            $('input.email').attr('disabled', true);
        }
    });
});

小提琴 http://jsfiddle.net/m2h5fc9b/

检查上面的表格字段是否正确填写？

1 个答案: