JQuery Mobile验证方法无法正常工作

时间:2014-07-18 22:09:08

标签: jquery-mobile jquery-validate

好吧所以我使用jQuery Validation Plugin验证我的from..it中的输入完美地运行它我分别运行2部分,但是当从一个部分重定向到下一个部分时它确实有效。  这是第一页

<section id="firstpage" data-role="page">
                <div data-role="header">
                    <h1>Page Content Header</h1>
                </div>
                <div class="ui-content" role="main">
                    <form method="post" id="frmLogin" action="login.php">
                        <label for="Username">Username:</label>
                        <input type="text" name="Username" id="Username" value="" placeholder="Your Username"/>

                        <label for="Password" class="ui-hidden-accessible">Password:</label>
                        <input type="password" name="Password" id="Password" value="" placeholder="Your Password"/>

                        <div class="ui-body ui-body-b">
                            <button class="btnLogin" type="submit"
                            data-theme="a">
                                Login
                            </button>
                        </div>

                    </form>
                    <p>
                        <a href="#secondpage" class="ui-btn ui-icon-grid ui-btn-icon-left" data-transition="flip">Sign up</a>
                    </p>
                </div>
                <div data-role="footer">
                    <h2>Page Content Footer</h2>
                </div>
            </section>

这是第二页             

            <div data-role="header">
                <h1>Page Content Header</h1>
            </div>
            <div class="ui-content">
                <form method="post" id="frmsignup" action="signup.php">
                    <fieldset class="ui-field-contain">
                        <label for="Fristname">Fristname</label>
                        <input type="text" name="Fristname" id="Fristname" value="" placeholder="Fristname"/>
                        <label for="Lastname">Lastname</label>
                        <input type="text" name="lname" id="lname" value="" placeholder="Last Name"/>
                        <label for="Lastname">Username</label>
                        <input type="text" name="Username2" id="Username2" value="" placeholder="Username"/>
                        <label for="Password">Password</label>
                        <input type="password" name="Password1" id="Password1" value="" placeholder="Password"/>
                        <label for="Passowrd2">Confrim Password:</label>
                        <input type="password" name="Password2" id="Password2" value="" placeholder="Confrim Password"/>
                        <label for="email">Your email: </label>
                        <input type="email" name="email" id="email" value="" placeholder="Your Email"/>
                        <fieldset>
                            <legend>
                                Gender
                            </legend>
                            <label for="gender_male">
                                <input type="radio" id="gender_male" value="m" name="gender">
                                Male </label>
                            <label for="gender_female">
                                <input type="radio" id="gender_female" value="f" name="gender">
                                Female </label>
                        </fieldset>
                        <div class="ui-body ui-body-b">
                            <button class="btnLogin" type="submit"
                            data-theme="a">
                                Sign up
                            </button>
                        </div>
                    </fieldset>
                </form>
            </div>
            <p>
                <a href="#firstpage" class="ui-btn ui-icon-grid ui-btn-icon-left" data-transition="flip">Login in</a>
            </p>
            </div>
            <div data-role="footer">
                <h2>Page Content Footer</h2>
            </div>
        </section>

JS

<script>
            $("#firstpage").on("pageinit", function() {
                $("form").validate({
                    rules : {
                        Username : {
                            required : true
                        },
                        Password : {
                            required : true
                        }
                    },
                    errorPlacement : function(error, element) {
                        error.insertAfter(element.parent());
                    }
                });
            });

            $("#secondpage").on("pageinit", function() {
                $("form").validate({
                    rules : {
                        Fristname : {
                            required : true
                        },
                        lname : {
                            required : true
                        },
                        Username2 : {
                            required : true,
                            minlength : 5
                        },
                        Password1 : {
                            required : true,
                            minlength : 5
                        },
                        Password2 : {
                            required : true,
                            minlength : 5,
                            equalTo : "#Password2"
                        },
                        email : {
                            required : true,
                            email : true
                        }
                    },
                    errorPlacement : function(error, element) {
                        error.insertAfter(element.parent());
                    }
                });
            });
        </script>

0 个答案:

没有答案