注册 登录
编程论坛 JavaScript论坛

表单验证中的光标定位问题,请高手帮忙!

tjhbzk 发布于 2010-12-09 15:58, 913 次点击
如果表单的用户名非法输入,当光标移动到密码框时,光标的定位就会发生冲突,如何才能解决呢,请高手帮忙看下,谢谢!

原码如下:
<SCRIPT  type="text/javascript" language="javascript">
    //用户名非空验证+长度验证+合法性验证
    function checkUserName()
    {
        var strName = document.myform.txtUser.value;
        if(strName == "") {
            document.getElementById("userNameError").innerHTML="<font color='red'>用户名不能为空</font>";
            document.myform.txtUser.focus();
            return false;
        }else {
            if(strName.length<4 || strName.length>16) {
                document.getElementById("userNameError").innerHTML="<font color='red'>用户名输入的长度为4-16个字符</font>";
                document.myform.txtUser.select();
                return false;
            }
            //用户名输入合法性验证
            var str = /^[0-9a-z][\w]*[0-9a-z]$/i;
            if(!(str.test(strName))) {
                document.getElementById("userNameError").innerHTML="<font color='red'>会员名包含非法字符,只能包括 a-z、0-9 和下划线</font>";
                document.myform.txtUser.select();
                return false;
            }
        }
    document.getElementById("userNameError").innerHTML = "";
    return true;
    }
    //密码非空验证+确认验证+长度验证
    function checkPass()
    {
        var psd1 = document.myform.txtPass.value;
        var psd2 = document.myform.txtRPass.value;
        if(psd1 == "") {
            document.getElementById("passwordError").innerHTML="<font color='red'>密码不能为空</font>";
            document.myform.txtPass.focus();
            return false;
        }else {
            if(psd1.length<6 || psd1.length>12) {
                document.getElementById("passwordError").innerHTML="<font color='red'>密码长度为6-12个字符</font>";
                document.myform.txtPass.select();
                return false;
            }
        }
        document.getElementById("passwordError").innerHTML="";
        //确认密码一致性验证
        if(psd2 != psd1) {
                document.getElementById("passwordError2").innerHTML="<font color='red'>确认密码与密码输入不一致</font>";
                document.myform.txtRPass.select();
                return false;
        }
        document.getElementById("passwordError2").innerHTML="";
    return true;
    }
</SCRIPT>
<BODY>
<FORM action="success.html" method="post" name="myform"  onSubmit="return checkForm()">
<TABLE   border="0" cellpadding="0" cellspacing="0" align="center">
  <TR>
    <TD width="107" height="36">用户名:</TD>
    <TD width="524"><INPUT name="txtUser" type="text" maxlength="16" onBlur="checkUserName()"><div id="userNameError" style="display:inline"></div>
    &nbsp;(只能输入字母或数字、下划线,4-16个字符)</TD>
  </TR>
    <TR>
    <TD width="107" height="36">密码:</TD>
    <TD width="524"><INPUT name="txtPass" type="password" onBlur="checkPass()"><div id="passwordError" style="display:inline"></div>&nbsp;(密码长度6-12位)</TD>
  </TR>
    <TR>
    <TD width="107" height="36">确认密码:</TD>
    <TD width="524"><INPUT name="txtRPass" type="password" onBLur="checkPass()"><div id="passwordError2" style="display:inline"></div></TD>
  </TR>
</TABLE>
</FORM>
1 回复
#2
hugeannex2010-12-10 09:37
非常的无语。
把onBlur全部改为onchange就行了。
1