Question

在让我的验证正常工作时遇到问题。使用jquery.validate执行基本登录表单，只需要几个字段。我保持输入按钮被禁用，直到所有验证都通过但它无法正常工作。一旦焦点离开第一个字段并显示错误消息，第二个输入字段的错误就会显示出来。在字段获得焦点后，只想让jquery.validate显示错误消息，然后失去焦点并检测到错误。

所以基本上，保持提交按钮被禁用，直到所有字段都有效，但在字段被激活然后失败之前不显示错误消息。

现在是我的小提琴：

FIDDLE

这是JS：

$('#my-login').validate({
onkeyup: false,
ignore: ":disabled,:hidden",

      submitHandler: function (form) {
      form.submit();
      }
      });
      $('#my-login input').on('blur', function () {
     var empty = false;
     $('#my-login > input').each(function() {
     if ($(this).val() == '') {
        empty = true;
    }
  });
  if (this.form != (empty) && $('#my-login').valid()) {
    $('#singleSubmitBtnLoan').prop('disabled', false);
  } else {
    $('#singleSubmitBtnLoan').prop('disabled', 'disabled');
  }
  });

   $("#singleSubmitBtnLoan").bind('click', function () {
if ($('#my-login').valid()) {
    $('#my-login').submit();
}
});

我的表格在这里：

<form id="my-login" name="my-login-form" action="notYetDude" method="get">
 <div>
   <label for="lastName" class="proximo">Last Name</label>
        <input type="text" id="lastName" name="lastName" aria-required="true" class="inputExtender largeFont" maxlength="50" />
  </div>
    <div class="inputAdjust">
        <label for="userNum">Last 4 Digits of userNum</label>
        <input type="tel" id="userNum" name="userNum" aria-required="true" maxlength="4" size="5" />
    </div>
    <div>
    <label for="appId" class="proximo" id="tt1-label">Reference Number</label>
        <input type="tel" id="appId" name="appId" aria-required="true" maxlength="10" size="11" value="12345678" />
    </div>
    <div style="margin-top: -4px">
    <input type="submit" id="singleSubmitBtnLoan" class="dsu-button lightBlue dsuBtnStyleLogin" disabled="true">Sign In</input>
    </div>

Answer 1

我认为这是由于模糊事件有效，因为整个表单都会调用，并显示错误。

我已将其更改为在执行此操作时隐藏UI错误。

如果现在签入模糊事件，则更改

 if (this.form != (empty) && $('#my-login').validate({
  errorClass: "invalidtemp"
}).checkForm()) {

...
}

请检查这是否符合需要：

http://jsfiddle.net/passionintellectual/bnhpznd0/2/

当jquery.validation错误为true时，保持提交按钮被禁用

1 个答案: