检查以上表格字段是否正确填写

Check above form field is correctly fill out?

本文关键字:是否 字段 表格 检查      更新时间:2024-06-11

我有一个带有一些表单字段的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>

我的问题是,我想被动地保留第二个表单字段(在这个表单中是"电子邮件字段"),直到第一个表单字段被正确填写。非活动意味着用户不能在那里键入或粘贴任何内容。

有人能在jquery中判断出这可能吗?如果可以,告诉我怎么做?

希望有人能指引我走正确的道路。非常感谢。

将禁用属性添加到电子邮件中,并在名称键控时启用/禁用

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);
        }
    });
});

Fiddlehttp://jsfiddle.net/m2h5fc9b/