美文网首页
用javascript验证表单

用javascript验证表单

作者: exmexm | 来源:发表于2017-05-17 17:23 被阅读0次

    有时候问题真的一点都不难,不知道自己为什么就没有那个耐心去解决。
    加油好吗
    早睡早起好吗
    相信自己好吗
    今天的上台讲ppt也获得掌声啊
    所以,Winney,不要拖延了。
    fight fight fight

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <title>Login</title>
            <script>
            function onvalidate() {
                var error = "";
                var username = document.getElementById("username");
                var password = document.getElementsByName("password")[0];
                var repassword = document.getElementsByName("repassword")[0];
                var sex = document.getElementsByName("sex");
                var interest = document.getElementsByName("interest");
                var comment = document.getElementsByName("comment")[0];
                var count = 0;
                
                if(username.value.length == 0) {
                    error += "用户名不能为空..\n";
                }
                
                if(password.value.length < 6 || password.value.length > 11) {
                    error += "密码长度不能少于6位或者超过11位..\n";
                }   
                
                if(password.value != repassword.value) {
                    error += "密码不一致..\n";
                }
                
                for(var i=0; i<sex.length; i++) {
                    if(sex[i].checked == 1) {
                        count += 1;
                    }               
                }
                if(count != 1) {
                    error += "一定要选择性别!\n"
                }
                
                count = 0;
                for(var i=0; i<interest.length; i++) {
                    if(interest[i].checked == 1) {
                        count += 1;
                    }
                }
                    
                if(count < 1 || count >=4) {
                    error +="最少选择一项兴趣爱好,至多选择三项兴趣爱好...\n";
                }
                
                if(comment.value.length == 0) {
                    error += "评论不能为空..\n";
                }
                
                if(error.length == 0) {
                    alert("true");
                    return true;
                }
    
                alert(error+"!!!");
                return false;
            }
            </script>
        </head>
        <body>
        <form action="sucess.jsp" method="post" onsubmit="return onvalidate()">
            用户:<input type="text" id="username" name="username"><br>
            密码:<input type="password" name="password"><br>
            确认密码:<input type="password" name="repassword"><br>
            性别:&nbsp男<input type="radio" name="sex"> &nbsp女<input type="radio" name="sex"><br>
            兴趣:
                &nbsp足球<input type="checkbox" name="interest" >
                &nbsp&nbsp篮球<input type="checkbox" name="interest" >
                &nbsp&nbsp羽毛球<input type="checkbox" name="interest" >
                &nbsp&nbsp排球<input type="checkbox" name="interest" ><br>
            地区:<select name="area">
                <option value="shanghai">上海</option>
                <option value="beijing">北京</option>
                <option value="guangzhou">广州</option>
                </select><br>
            说明:<textarea name="comment" rows="10" cols="10"></textarea><br>
            <input type="submit" name="submit" value="确认">&nbsp&nbsp<input type="reset" name="reset" value="重置">
            </form>
        </body>
    </html>
    

    相关文章

      网友评论

          本文标题:用javascript验证表单

          本文链接:https://www.haomeiwen.com/subject/mjndxxtx.html