在jquery验证插件中添加自己的规则

Question

我有下一个jquery代码：

$("input").rules("add", {
    required: true,
    messages: {
        required: 'Please enter your telephone number'
    },
    errorPlacement: function(error, element) {
        console.log('bob');
        element.insertBefore(error);
    }
});

我试图在这个问题中添加新规则，如回答： jquery验证和id的ft数字

我有这样的HTML代码：

<form method='post' action='' id='#countersForm'>
<input id="88" class="counter_input active" type="text" enabled="">
<input id="89" class="counter_input active" type="text" enabled="">
</form>

我的问题是：

1）为什么浏览器尝试验证加载页面上的字段？ 我不需要这个（在页面加载时出现消息bob）。

2）为什么只有第一个输入字段在验证？ 我想验证所有字段。

3）为什么控制台说，该元素没有定义？

文档说元素参数包含验证元素。 console.log(element)说它没有被修改。 为什么？

Answer 1

来自文档 ：

读取，添加和删除元素的规则。

它说'一个'元素。 在您的情况下$('input')返回两个元素。

验证插件使用元素的name属性，您的元素没有名称。

您必须使用要validate()的form上的validate()方法初始化插件，例如

$("#myform").validate({ //where my form is the id of your form
 rules: {
  name: "required", //name is the name of your element
 },
 messages: {
 }
});

Answer 2

感谢您的回答和评论。

我解决了我的问题。 工作代码（当前问题已解决）在这里： http ： //jsfiddle.net/2LRv7/2/

我的js代码中存在一个巨大的错误。 我把errorPlacement部分放到规则函数中。 我必须把这个选项放到.validate部分。

$("#countersForm").validate({
    errorPlacement: function (error, element) {
        console.log(error);
        var br = $( "<br>" );
        error.insertAfter(element);
        br.insertAfter(element);
    }
});

另外，正如@TilwinJoy所说，我用$('input').rules(/*....*/)错了。 我不得不使用each功能。

这段代码没问题：

$("input").each(function () { // next code will affect all input fields
    $(this).rules("add", { // $(this) is my input field
    required: true,
        digits: true,
        messages: {
            required: 'Это поле обязательно для заполнения',
            digits: 'В поле могут быть только цифры'
        }
    });
});

当前问题解决了，但我有另一个问题。 如果你想帮助检查一下这个问题： 第一次检查时没有将类添加到error元素中，但是当再次检查字段时一切正常（jquery验证插件）