Javascript 简单jquery验证创建错误消息

很抱歉为一个经验更丰富的jquery用户提出了一个基本问题，但我正在学习-我目前正在进行表单验证，并希望继续使用更高级的方法，我正在使用一个教程，我喜欢这个教程。只是他们缺少一点解释，我转到这里：

好的，我们有一个基本的表格

提交的表格有错误

代码

<form method="post" name="productform" id="productform" >
    <p>
        <label for='prodid'>Product ID: (maxlength 10)</label><br>
        <input type="text" name="prodid" >
    </p>
    <p>
        <label for='email'>Email: (minlength 10)</label><br>
        <input type="text" name="email" >
    </p>
    <p>
        <label for='address'>Address( length between 10 and 250)</label><br>
        <input type="text" name="address">
    </p>    
    <p>
        <label for='message'>Message:( length between 50 and 1050)</label> <br>
        <textarea name="message"></textarea>
    </p>

    <input type="submit" name='submit' value="Post it !">
</form>

CSS

body
{
  font-family: Arial, Sans-serif;
}
.error
{
color:red;
font-family:verdana, Helvetica;
}

我的问题

提交表单时出现错误，文本框旁边会显示红色错误消息？我无法在Jquery代码中看到创建错误消息的位置…如果文本框旁边有一个span元素或类似的元素，然后将错误附加到该元素，我无法在上面的代码中看到错误发生的位置

---

我肯定我在这里遗漏了一些简单或基本的东西……但我无法继续，直到我掌握了这一点，所以这相当令人沮丧。

正如您在代码中看到的，他们使用了Jquery插件

因为这三个字段的规则为

required:true

，所以会出现此错误

$("#productform").validate(
      {
        rules: 
        {
          prodid: 
          {
            required: true,
            maxlength: 10
          },
          email: 
          {
            required: true,
            email: true,
            minlength:10
          },
          address:
          {
            required: true,
            rangelength:[10,250]
          },

---

正如您在代码中看到的，他们使用了Jquery插件

因为这三个字段的规则为

required:true

，所以会出现此错误

$("#productform").validate(
      {
        rules: 
        {
          prodid: 
          {
            required: true,
            maxlength: 10
          },
          email: 
          {
            required: true,
            email: true,
            minlength:10
          },
          address:
          {
            required: true,
            rangelength:[10,250]
          },

这里使用的是，因此错误消息由该插件自动处理

这意味着您不需要使用span或其他元素来包装错误消息，这是由插件处理的

在给定的jquery函数中，指定了validtaion规则，因此表单将根据这些规则进行验证

此CSS用于设置这些消息的样式：

.error {
    color:red;
    font-family:verdana, Helvetica;
}

这里使用的是，因此错误消息由该插件自动处理

这意味着您不需要使用span或其他元素来包装错误消息，这是由插件处理的

在给定的jquery函数中，指定了validtaion规则，因此表单将根据这些规则进行验证

此CSS用于设置这些消息的样式：

.error {
    color:red;
    font-family:verdana, Helvetica;
}

正在使用

validate

插件。正在使用

validate

插件。