1

我正在使用jQuery 验证插件,并希望在插件检测到有效或无效输入时运行我自己的代码。

我发现.validate()我需要的两个选项是success并且showErrors我可以让它们都自己工作:

var validator = $('#form').validate({
  rules: {
    name: "required",
    email: {
      required: true,
      email: true
    }
  },
success: function() {
  console.log('success');
}

success每次进行有效输入时都会记录下来。并且showErrors也可以正常工作:

var validator = $('#form').validate({
  rules: {
    name: "required",
    email: {
      required: true,
      email: true
    }
  },
showErrors: function() {
  console.log('error');
}

但是当我尝试将两者结合起来error时,无论输入是否有效,每次都会记录:

var validator = $('#form').validate({
  rules: {
    name: "required",
    email: {
      required: true,
      email: true
    }
  },
success: function() {
  console.log('success');
},
showErrors: function() {
  console.log('error');
}

选项的顺序没有任何影响。

有谁知道为什么这两个选项不能一起工作以及如何在有效和无效输入上运行我自己的函数?

4

2 回答 2

3

"showErrors" 不会仅在检测到错误时调用,而是在每次更改输入时调用,无论您键入的值如何。

“showErrors”接收两个参数:“errorMap”和“errorList”。要验证是否确实存在错误,您必须检查这些值之一:

showErrors: function(errorMap, errorList) {
  if (errorsList.length > 0) {
    console.log('error');
  }
}

您还可以在 showErrors 函数中处理“成功”事件,因为它是在当前验证器上下文中调用的。

showErrors: function(errorMap, errorList) {
  if (errorsList.length == 0) {
    this.currentElements.addClass("success");
  }
}
于 2014-05-23T12:25:39.837 回答
1

想通了……有点。

我替换showErrorshighlight,它允许我对有效或无效条目运行回调。

但是,该插件仍然显示默认错误消息——可能是因为我没有对showErrors. 所以我不得不通过在每个字段上为消息设置一个空字符串来破解它:

var validator = $('#form').validate({
  rules: {
    name: "required",
    email: {
      required: true,
      email: true
    }
  },
  messages: {
    name: '',
    email: ''
  },
  success: function() {
    console.log('success');
  },
  highlight: function() {
    console.log('highlight');
  }
}

当然没有我想要的那么干净,所以如果有人有更好的方法那就太好了。

于 2013-09-01T04:16:56.137 回答