美文网首页
用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验证表单

    有时候问题真的一点都不难,不知道自己为什么就没有那个耐心去解决。加油好吗早睡早起好吗相信自己好吗今天的上台讲ppt...

  • JavaScript 表单

    1.JavaScript 表单验证 HTML 表单验证可以通过 JavaScript 来完成。以下实例代码用于判断...

  • runoob js第八天

    JavaScript 表单验证 JavaScript 表单验证avaScript 可用来在数据被送往服务器前对 H...

  • JavaScript高级程序设计读书笔记

    JavaScript简介 JavaScript历史客户端完成表单验证 JavaScript是什么ECMAScrip...

  • javascript和Jquery的表单验证

    javascript的表单验证: Jquery的表单验证: 首先的先在工程里面导入类库 -->直接http://w...

  • 11 js之表单验证

    JavaScript 表单验证 1 必填(或必选)项目 2 E-mail 验证

  • JavaScript 表单验证

    JavaScript 表单验证 JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输...

  • JS验证Form表单

    JavaScript 表单验证 JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据...

  • JavaScript概述

    JavaScript发展史 JavaScript 诞生于 1995 年。它当时的目的是为了验证表单输入的验证 。因...

  • JavaScript 表单验证

    JavaScript 表单验证JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进...

网友评论

      本文标题:用javascript验证表单

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