Question

我已经尝试使用JQuery多次使用自定义消息来验证错误，但是我仍然对自己在哪里出错感到困惑。我曾尝试使用普通的验证消息，但是当我尝试使用自定义消息时，它显示了我一个错误。

下面是到目前为止我尝试过的示例代码，执行起来并不成功。

<form id="myform">
  <tr>
    <td class="alpha">username</td>
    <td>
      <input type="username" type="text" value="">
    </td>
  </tr>
  <br/>
  <tr>
    <td class="alpha">postcode</td>
    <td>
      <input type="postcode" type="text" value="">
    </td>
  </tr>
  <input type="submit" />
</form>

$.validator.setDefaults({
  submitHandler: function() {
    alert("submitted!");
  }
});

$document.ready(function() {
  $("#myform").validate({
    rules: {
      password: "required",
      postcode: {
        required: true,
        minlength: 3
      }
    },
    messages: {
      username: {
        required: "*Please enter a username",
        minlength: "Your username must consist of at least 2 characters"
      },
      postcode: {
        required: "Field PostCode is required",
        minlength: "Field PostCode must contain at least 3 characters"
      }
    }
  });
});

Answer 1

按照书面规定，您的代码也无法使用默认消息。

请阅读我在代码中的评论...

rules: {
    password: "required",  // <- input with name="password" (where is "password"?)
    postcode: {            // <- input with name="postcode"
        required: true,
        minlength: 3
    }
},
messages: {
    username: {     // <- input with name="username"
        required: "*Please enter a username",
        minlength: "Your username must consist of at least 2 characters"
    },
    postcode: {     // <- input with name="postcode"
        required: "Field PostCode is required",
        minlength: "Field PostCode must contain at least 3 characters"
    }
}

rules和messages对象的参数由输入元素的name属性键入。您的输入元素不包含任何name属性。插件要求所有表单输入都包含唯一的name，如果没有这些插件，插件将无法使用。
您的type属性值无效。没有type="username"和type="postcode"这样的东西；并且您错误地在每个输入type

<input type="username" type="text" value="">

对于您而言，您甚至没有尝试为username字段定义任何规则。在password对象中只有postcode和rules。

修复无效的HTML标记和JavaScript ...

从每个输入中删除所有无关的type属性。
为每个输入添加唯一的name属性。
仅引用name和rules对象中的messages属性。

演示：jsfiddle.net/2tx6u7wf/

尝试在jQuery验证中执行自定义消息时出现错误

1 个答案: