javascript - Jquery验证示例不起作用

Question

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

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

我的 JS 代码：

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

那不起作用...任何帮助或工作示例将不胜感激。

Answer 1

尝试这个

 <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>

Answer 2

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

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

在 JsBin中可以找到一个活生生的例子。

Answer 3

在表单中调用该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"
   }
});

另请参阅此示例。