Question

我正在使用jQuery Validation Plugin来验证html页面上的许多输入。始终需要名字，或者是电子邮件或移动电话，但不是两者。为此，我使用require_from_group_exact方法。

当输入按此顺序排列时，验证完美无缺：

<form>
  Email: <input class="commsinfo" name="email"><br>
  Mobile: <input class="commsinfo" name="mobile"><br>
  Name: <input name="firstname"><br>
  <input type="submit">
</form>

但是，如果你交换输入，最后一个输入（名字）的验证没有正确发生（你必须输入一个名字然后删除它才能触发验证） - 为什么?? 。这是我想要解决的所需顺序和问题 - 这是jQuery Validation Plugin或我的代码的错误吗？

<form>
  Name: <input name="firstname"><br>
  Email: <input class="commsinfo" name="email"><br>
  Mobile: <input class="commsinfo" name="mobile"><br>
  <input type="submit">
</form>

我创建了JSFiddle版本未正确验证的版本。可以在小提琴中看到jQuery.validator.addMethod和$（'form'）。validate的代码。

Answer 1

在您提供的示例中，对fields.valid()的调用似乎存在问题。

我已经更新了小提琴，删除了一些我认为你不需要的代码。对valid()的调用似乎是问题的关键，删除它会导致验证按预期工作。

现在更新的代码如下所示：

jQuery.validator.addMethod("require_from_group_exact", function(value, element, options) {
  var validator = this;
  var selector = options[1];
  var validOrNot = $(selector, element.form).filter(function() {
    return validator.elementValue(this);
  }).length == options[0];

  return validOrNot;
}, jQuery.format("Please fill {0} of these fields."));

$('form').validate({
  rules: {
    firstname: { required: true },
    email: { require_from_group_exact: [1, ".commsinfo"] },
    mobile: { require_from_group_exact: [1, ".commsinfo"] },
  }
});

Updated Fiddle

Answer 2

您未检查所有输入字段

更改var fields = $(selector, element.form);

到var fields = $('form :input');

Updated Fiddle

Answer 3

每次拨打

fields.valid();

您的验证器方法被调用，因此您会得到明显奇怪的行为。您可以自己检查这个调试。

在'require_from_group_exact'验证输入未正确验证之前，对任何输入进行jQuery验证

3 个答案: