Question

我一直在搜索，不明白为什么我的代码无效。甚至尝试过jsfiddle，看它是否有效，但没有发生在我身上。

为了清楚起见我正在使用twitter bootstrap，并且没有对表单的POST部分做任何事情。

<div id="register">
    <form id="registerform" method="POST" action=""  accept-charset='UTF-8'>
       <fieldset>
         <legend>Register</legend> <br>
         <input type="text" name="firstName" id="firstName" placeholder="First Name" maxlength="20" value=""/> <br>
         <input class="btn btn-primary" type="submit" name="create" value="Join"/>
         <a href="/"><button type="button" class="btn">Cancel</button></a>
      </fieldset>
    </form>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js" type="text/javascript"></script>
<script src="../js/jquery.validation.min.js"></script>
<script>
 $(document).ready(function () {
               var form = $("#registerform");
               var firstname = $("#firstName");                      
               var validator = form.validate({
                        rules: {
                            firstname: {
                                required: true,
                                minlength: 4
                            }
                        },
                });
     });

任何帮助都会很棒。

Answer 1

您的字段name为firstName，rules选项采用name属性，而不是您尝试的id。

DEMO：http://jsfiddle.net/xGc79/

$(document).ready(function () {

    var form = $("#registerform");

    var validator = form.validate({
        rules: {
            firstName: { // <-- this is the `name` attribute
                required: true,
                minlength: 4
            }
        }
    });

});

Answer 2

规则区分大小写

$(document).ready(function () {
    var form = $("#registerform");
    var firstname = $("#firstName");                      
    var validator = form.validate({
        rules: {
            firstName: {
                required: true,
                minlength: 4
            }
        },
    });

    form.submit(function(){
        if(!form.valid()){
            return false;
        }
    })
});

演示：Fiddle

麻烦通过jquery进行验证

2 个答案: