Jquery验证示例不起作用答案

【问题标题】：Jquery Validation example not workingJquery验证示例不起作用
【发布时间】：2012-05-09 11:25:04
【问题描述】：

我正在尝试测试一个非常基本的 jquery 验证示例。代码如下：

<form action="/" method="post">
    <input type="text" name="foo" id="foo"/>
</form>

我的 JS 代码：

$('#foo').validate({
    foo: {
        required: true,
        minlength: 2
    }
});

这样不行…… 任何帮助或工作示例将不胜感激。

【问题讨论】：

难道你不应该对<form> 进行.validate() 调用，并在字段名称之后命名验证配置的属性吗？您的字段称为“foo”，而不是“name”。

标签： javascript asp.net-mvc validation jquery-validate

【解决方案1】：

您在表单上使用 validate 方法，而不是在单个元素中，并且所有规则都应在 rules 属性内，例如：

$("form").validate({
    rules: {
        foo: {
            required: true,
            minlength: 2
        }
    }
});

一个活生生的例子可以是found in JsBin。

【讨论】：

【解决方案2】：

在表单中调用validate 方法并将规则包装在rules 对象中。如果你想添加一个messages 对象。

HTML：

<form id="form" action="/" method="post">
    <input type="text" name="foo" id="foo">
</form>

javascript：

$('#form').validate({
    rules: {
        foo: {
            required: true,
            minlength: 2
        }
    },
    messages: {
       foo: "Please enter your foo"
   }
});

另见this example。

【讨论】：

【解决方案3】：

试试这个

 <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>

<script> 
    $(document).ready(function(){
        $("#commentForm").validate({
        rules: {
            txtPhNumber: "required",
            txtPhNumber2:
                {
            equalTo: "#txtPhNumber"
                }
            }
        });
    });

  </script>

【讨论】：