问几个表单验证问题！ - JavaScript论坛

楼主

问题点数：0 回复次数：1

问几个表单验证问题！

这是代码：

程序代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. xmlns="http://www. http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<script language="javascript">
<!--
    function f1(){
        if(document.getElementById("usr").value==""){
            document.getElementById("right1").innerHTML="";
            alert("用户名不可以为空");
            document.getElementById("usr").focus();//为什么这句在firefox下没有作用？想要实现用户点击确定后在自动跳转到usr输入框在firefox下应该怎样实现？
        }else{
            document.getElementById("right1").innerHTML="正确";
        }
    }
        function f2(){
        var a=document.form.psw1.value
        if(a==""){
            document.getElementById("right2").innerHTML=""
            alert("密码不能为空");
            
        }else if(a.length<6||a.length>=15){
            document.getElementById("right2").innerHTML="";
            alert("密码必须大于等于6位且小于15位");
            //想在这加入个js语句，可以在alert功能完成后，实现已经输入的错误的密码（比如长度是4位的）自动清除，用什么方法？为什么下面的语句无法实现这个效果？
            //document.getElementById("psw1").value="";
            
        }else if(6<=a.length&&a.length<15){
            document.getElementById("right2").innerHTML="正确";
            
        }
    }
    function f3(){
        if(document.form.psw2.value==document.form.psw1.value){
            document.getElementById("right3").innerHTML="正确"
        }else if(document.form.psw2.value!=document.form.psw1.value){
            document.getElementById("right3").innerHTML=""
            alert("确认密码和密码不相同");
        }
    }
    function f4(){
            if(document.form.phone.value==""){
            document.getElementById("right4").innerHTML=""
            alert("联系电话不可以为空");
            
        }else{
            document.getElementById("right4").innerHTML="正确"
            
        }
    }    
//-->
</script>
<body>
<form name="form" id="form" >
<table width="762" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <th width="215" scope="col">用户名：</th>
        <td width="275"><input type="text" name="usr" id="usr" onblur="f1()"  /></td>
        <td id="right1"></td>
    </tr>
    <tr>
        <th scope="row">密码：</th>
        <td><input type="password" name="psw1" id="psw1" onblur="f2()" /></td>
        <td id="right2">&nbsp;</td>
    </tr>
    <tr>
        <th scope="row">确认密码：</th>
        <td><input type="password" name="psw2" id="psw2" onblur="f3()" /></td>
        <td id="right3">&nbsp;</td>
    </tr>
    <tr>
        <th scope="row">电话号码：</th>
        <td><input type="text" name="phone" id="phone" onblur="f4()"  /></td>
        <td id="right4">&nbsp;</td>
    </tr>
    <tr>
        <th scope="row">&nbsp;</th>
        <td><input type="reset" name="reset" /></td>
        <td><input type="submit" name="submit" /></td>
    </tr>
</table>
</form>
</body>
</html>

有几个问题已经在js代码那注释了，还有下面的问题：
1：我在输入了用户名后，然后点击reset按钮，用户名里面的内容是清空了，但是为什么后面还是会显示正确呢？有什么解决办法没？
2：如果我现在要是直接按sumit按钮，那我写的几个函数不就没法实现验证用户是否已经输入了内容了吗？我还想写个函数，在onsubmit是调用，是判断用户是否已经填写完整的，我的函数是这样的：

程序代码：

    function f5(){
        if(f1()!=true){
            f1()
            return false;
        }else if(f2()!==true){
            f2()
            return false;        
        }else if(f3()!==true)
            f3()
            return false;        
        }elseelse if(f4()!==true){
            f4()
            return false
        }else {
                       document.write("欢迎注册")
            return true
        }
    }

其中的f1（），f2（）等的返回值我在测试的时候是加上去的，上面给的那段代码上没有给出，然后我在form内加上了onsubmit事件执行f5()这个函数，可是这个函数没有任何效果？这样写有错么？如果有错，是不是逻辑上的错误，还是什么错误？
那正确的方法有该如何实现呢？

搜索更多相关主题的帖子: 表单　验证　