0

我正在尝试为我的注册页面添加一些实时表单验证，但是只有我的电子邮件输入显示了我应该显示的正确或错误输出，而且我的用户名或密码都不是，我在过去的几个小时中尝试查看出了什么问题，但我只是在代码中找不到任何可能导致的错误。希望有人能看到错误。

表格代码

 <form id="jform" action="" method="post" enctype="multipart/form-data">
                <div id="modal_content_left">
                Register

                <ul>

                    <li class="required" type="none">

                        <label>

                            <input type="text" class="reg_text tip" name="username" id="username" title="8 - 16 Characters" placeholder="Username*"/>

                        </label>

                        <label>
                             <br />
                            <input type="text" class="reg_text tip" name="email" id="email" title="Get Verified" placeholder="Email*"/>

                        </label>
                        <label>
                            <br />
                            <input type="password" class="reg_text tip" name="password" id="password" title="Min 8 Characters" placeholder="Password*"/>

                        </label>


                        <label>
                            <br />
                            <input type="password" class="reg_text tip" name="cpassword" id="cpassword" title="Min 8 Characters" placeholder="Verify Password*"/>
                        </label>
                    </li>


                </ul></form>

jQuery代码

// JavaScript Document

$(document).ready(function(){
    jVal = {

            'username' : function() {

            $('body').append('<div id="usernameInfo" class="info"></div>');

            var ele = $('#username');
            var pos = ele.offset();



            var patt = /^(?=.*[a-z].*)\w{8,}$/i;

            if(!patt.test(ele.val())) {
                jVal.errors = true;
                    ele.removeClass('correct').addClass('error');
                    ele.effect("shake", { times:3 }, 50);

            } else {
                    ele.removeClass('error').addClass('correct');
            }
        },




        'email' : function() {

            $('body').append('<div id="emailInfo" class="info"></div>');

            var ele = $('#email');
            var pos = ele.offset();



            var patt = /^.+@.+[.].{2,}$/i;

            if(!patt.test(ele.val())) {
                jVal.errors = true;
                    ele.removeClass('correct').addClass('error');
                    ele.effect("shake", { times:3 }, 50);

            } else {
                    ele.removeClass('error').addClass('correct');
            }
        },

        'password' : function(){

            $('body').append('<div id="passwordInfo" class="info"></div>');


            var ele = $('#password');
            var pos = ele.offset();


            if(ele.val().length < 6) {
                jVal.errors = true;
                    ele.removeClass('correct').addClass('error');
                    ele.effect("shake", { times:3 }, 50);

            } else {
                    ele.removeClass('error').addClass('correct');
            }

        },





    $('#username').change(jVal.username);
    $('#email').change(jVal.email);
    $('#password').change(jVal.password);

    $('input[name="agree_cons"]').change(jVal.agree);
});
4

1 回答 1

1

你的代码没有问题。如果你包含 jQuery 和 jQuery UI，它就可以工作。

这是一个工作小提琴。我所做的唯一更改是：

  1. 包括 jQuery
  2. 包括 jQuery UI。
  3. .correct为和添加 CSS 声明.error

仔细检查您是否在自己的代码中执行所有这些操作，并且您应该得到预期的结果。

于 2012-05-05T03:30:38.577 回答