第十四周学习总结

利用正则表达式来筛选信息

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html >
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>验证注册页面</title>
        <style type="text/css">
            body {
                margin: 0;
                padding: 0;
                font-size: 12px;
                line-height: 20px;
            }
            .main {
                width: 525px;
                margin-left: auto;
                margin-right: auto;
            }
            .hr_1 {
                font-size: 14px;
                font-weight: bold;
                color: #3275c3;
                height: 35px;
                border-bottom-width: 2px;
                border-bottom-style: solid;
                border-bottom-color: #3275c3;
                vertical-align: bottom;
                padding-left: 12px;
            }
            .left {
                text-align: right;
                width: 80px;
                height: 25px;
                padding-right: 5px;
            }
            .center {
                width: 280px;
            }
            .in {
                width: 130px;
                height: 16px;
                border: solid 1px #79abea;
            }
 
            .red {
                color: #cc0000;
                font-weight: bold;
            }
 
            div {
                color: #F00;
            }
        </style>
        <script type="text/javascript">
            //校验用户名
            function checkUser() {
                //获取用户名输入的内容
                var content = document.getElementById("user").value;
                //找到span标签
                var span = document.getElementById("userSpan");
               //使用正则表达式校验用户输入的内容
                if(reg.test(content)){
                    //校验成功
                    span.innerHTML = "<font color='green'>成功</font>";
                    return true;
                }else {
                    //校验失败
                    span.innerHTML = "<font color='red'>用户名由字母或中文组成的4-16位字符</font>";
                    return false;
                }
            }
            //校验邮箱
            function checkEmail() {
                //获取用户输入的内容
                var content = document.getElementById("email").value;
                //编写正则表达式校验 sunnyh@126.com
                var reg = /^[a-z1-9][a-z0-9]+@[a-z0-9]{2,}(\.[a-z]{2,3}){1,2}$/i;
                //获取span标签
                var span = document.getElementById("emailSpan");
                //使用正则表达式校验用户输入的内容
                if(reg.test(content)){
                    span.innerHTML = "<font color='green'>成功</font>";
                    return true;
                }else {
                    span.innerHTML = "<font color='red'>邮编输入非法!</font>";
                    return false;
                }
 
            }
            //校验密码
            function checkPass() {
                //获取用户输入的内容
                var content = document.getElementById("pwd").value;
                //密码只能由英文字母和数字组成,长度为4-10个字符
                var reg = /^[a-zA-Z0-9]{4,10}$/;
                //获取span标签
                var span = document.getElementById("passSpan");
                //使用正则表达式校验用户输入的内容
                if(reg.test(content)){
                    span.innerHTML = "<font color='green'>成功</font>";
                    return true;
                }else {
                    span.innerHTML = "<font color='red'>密码由英文字母和数字组成的4-10位字符</font>";
                    return false;
                }
 
            }
            //检测两次密码是否一致
             function checkPass2() {
                //获取用户输入的内容
                var content = document.getElementById("repwd").value;
                 if(repwd != psw){
                span.innerHTML = "<font color='red'>两次密码输入不一致!</font>";}
 
            }
            //检查手机号码是否合理
            function checkPhone() {
                //获取用户输入的内容
                var content = document.getElementById("mobile").value;
                //
                var reg = /^1[3578]\d{9}$/;
                //获取span标签
                var span = document.getElementById("phoneSpan");
                //使用正则表达式校验用户输入的内容
                if(reg.test(content)){
                    span.innerHTML = "<font color='green'>成功</font>";
                    return true;
                }else {
                    span.innerHTML = "<font color='red'>手机号码非法!</font>";
                    return false;
                }
 
            }
            //检测生日是否合法
             function checkBirth() {
                //获取用户输入的内容
                var content = document.getElementById("birth").value;
                //
                var reg = /^([0-9]|[0-9]{2}|100)$/;
                //获取span标签
                var span = document.getElementById("birthSpan");
                //使用正则表达式校验用户输入的内容
                if(reg.test(content)){
                    span.innerHTML = "<font color='green'>成功</font>";
                    return true;
                }else {
                    span.innerHTML = "<font color='red'>年龄格式非法!</font>";
                    return false;
                }
 
            }
            function logins(){
        window.open("login.jsp");
   }
             
            function createRequest(url){
         		http_request=new XMLHttpRequest();
         		http_request.onreadystatechange=function(){
         			if(http_request.readyState==4){
         				if(http_request.status==200){
         					
         					alert(http_request.responseText);
         					
         				}else{
         					alert("您所请求的地址有误!");
         				}
         			}
         		}
         		http_request.open("POST",url,true);
         		http_request.send(null);
         	}
 
        </script>
    </head>
 
    <body>
        <form action="zhucecheck.jsp" method="post" >
            <table class="main" border="0" cellspacing="0" cellpadding="0">
                <tr>
                    <td class="hr_1">新用户注册</td>
                </tr>
                <tr>
                    <td style="height:10px;"></td>
                </tr>
                <tr>
                    <td>
                    <table width="100%" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                            <!-- 不能为空, 输入长度必须介于 5 和 10 之间 -->
                            <td class="left">用户名:</td>
                            <td class="center">
                            <input id="user" name="user" type="text" class="in" onblur="checkUser()" /><span id="userSpan"></span>
                            </td>
                        </tr>
                        <tr>
                             <!-- 不能为空, 输入长度大于6个字符 -->
                            <td class="left">密码:</td>
                            <td class="center">
                            <input id="pwd" name="pwd" type="password" class="in" onblur="checkPass()" /><span id="passSpan"></span>
                            </td>
                        </tr>
                        <tr>
                            <!-- 不能为空, 与密码相同 -->
                            <td class="left">确认密码:</td>
                            <td class="center">
                            <input id="repwd" name="repwd" type="password" class="in" onblur="checkPass2()"/>
                            </td>
                        </tr>
                        <tr>
                            <!-- 不能为空, 邮箱格式要正确 -->
                            <td class="left">电子邮箱:</td>
                            <td class="center">
                            <input id="email" name="email" type="text" class="in" onblur="checkEmail()"/><span id="emailSpan"></span>
                            </td>
                        </tr>
                        <tr>
                            <td class="left">手机号码:</td>
                            <td class="center">
                            <input id="mobile" name="mobile" type="text" class="in" onblur="checkPhone()"/><span id="phoneSpan"></span>
                            </td>
                        </tr>
                        <tr>
                            <td class="left">年龄:</td>
                            <td class="center">
                            <input id="birth" name="birth" type="text" class="in" onblur="checkBirth()"/><span id="birthSpan"></span>
                            </td>
                        </tr>
                        <tr>
                            <td class="left">QQ号:</td>
                            <td class="center">
                            <input id="QQ" name="QQ" type="text" class="in" />
                            </td>
                        </tr>
                        <tr>
                            <td class="left">&nbsp;</td>
                            <td class="center">
                            <input type="button" value="登陆" onclick="logins()">
                             <input type="submit" value="注册">
                            </td>
                        </tr>
                    </table></td>
                </tr>
            </table>
        </form>
    </body>
</html>

在这里插入图片描述
登录后的页面:
在这里插入图片描述

<%@ page language="java" import="java.sql.*" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>Address : Home</title>
        <link rel="icon" type="image/icon" href="assets/images/tabicon.ico">

        <link rel="stylesheet" type="text/css" href="">
        <link href="assets/css/bootstrap.min.css" rel="stylesheet">
        <link href="assets/css/bootstrap-theme.min.css" rel="stylesheet">
        <link href="assets/css/font-awesome.min.css" rel="stylesheet">
        <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,600,700,700i" rel="stylesheet">
        <link href="https://fonts.googleapis.com/css?family=Crimson+Text:400,700,700i|Josefin+Sans:700" rel="stylesheet">
        <link href="assets/css/main.css" rel="stylesheet">
        <link rel="icon" href="assets/images/logo.png">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
        
    </head>

    <body>
    <%request.setCharacterEncoding("utf-8"); %>
        <div id="index">                                           <!-- Index starts here -->
            <div class="container main">
                <div class="row home">
                    <div id = "index_left" class="col-md-6 left">
                        <img class="img-responsive img-rabbit" src="assets/images/yuwen.jpg">
                    </div>
                    <div id = "index_right" class="col-md-6 text-center right">
                        <div class="logo">
                            <img src="assets/images/logo.png">
                            <h4>To Be A BETTER MAN</h4>
                        </div>
                        <p class="home-description">
                            Hi, This is a list of function</p>
                        <div class="btn-group-vertical custom_btn animated slideinright">
                        	<div id="about" class="btn btn-rabbit">背诵界面</div>
                            <div id="article" class="btn btn-rabbit">课文原音</div>
                            <div id="work" class="btn btn-rabbit">目标设置</div>
                            <div id="contact" class="btn btn-rabbit">我的界面</div>
                        </div>      
                        <div class="social">
                            <a href="#"><i class="fa fa-pinterest" aria-hidden="true"></i></a>
                            <a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a>
                            <a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

                
            </div>
        </div>                                                      <!-- index ends here -->

        <div id="about_scroll" class="pages ">                      <!-- about strats here  -->
            <div class="container main">
                <div class="row">
                    <div class="col-md-6 left" id="about_left">
                        <img class="img-responsive img-rabbit" src="assets/images/mulu.jpg">
                    </div>

                    <div class="col-md-6 right" id="about_right">
                        <a href="#index" class="btn btn-rabbit back"> <i class="fa fa-angle-left" aria-hidden="true"></i> Back to home </a>
                 
                        <div id="watermark">
                            <h2 class="page-title" text-center>About</h2>
                            <div class="marker">a</div>
                        </div>
                        <button type="submit" class="btn btn-rabbit submit">一年级</button>
                        <button type="submit" class="btn btn-rabbit submit">二年级</button>
                        <button type="submit" class="btn btn-rabbit submit">三年级</button>
                        <button type="submit" class="btn btn-rabbit submit">四年级</button>
                        <button type="submit" class="btn btn-rabbit submit">五年级</button>
                        <button type="submit" class="btn btn-rabbit submit">六年级</button>
                        <button type="submit" class="btn btn-rabbit submit">七年级</button>
                        <button type="submit" class="btn btn-rabbit submit">八年级</button>
                        <button type="submit" class="btn btn-rabbit submit">九年级</button>
                        <p class="info"> 
    <%
	try {
		Class.forName("com.mysql.jdbc.Driver");
	} catch (ClassNotFoundException e) {
		System.out.println("加载数据库驱动时抛出异常,内容如下:");
		e.printStackTrace();
	}
	Connection conn = DriverManager
			.getConnection(
	"jdbc:mysql://localhost/list?useUnicode=true&characterEncoding=utf8",
					"root", "123456");
	Statement stmt = conn.createStatement();
	String phone = request.getParameter("name");
	ResultSet rs = stmt
			.executeQuery("select * from user where phone = '"+phone+"'");
	while (rs.next()) {
		out.println("姓名: " + rs.getString(2)+"<br>" + "电话:" + rs.getString(3)+"<br>" + "	QQ:" + rs.getString(5)+"<br>" +"微信:"+rs.getString(6) +"<br>"+ "邮箱:"+rs.getString(7)+"<br>");
	}
	rs.close();
	stmt.close();
	conn.close();
%></p> 
			<form action="xiugai.jsp" method="post">
			<div>
			<button type="submit" class="btn btn-rabbit submit">Update</button>
			</div>
			</form>
 
                    </div>
                </div>
            </div>            
        </div>                                                                <!-- About ends here -->
        
		        <div id="article_scroll" class="pages">                                  <!-- 课程原音 starts here -->
            <div class="container main">
                <div class="row">
                    <div class="col-md-6" id="article_left">
                        <div id="owl-demo" class="owl-carousel owl-theme">
                            <div class="item"><img class="img-responsive img-rabbit" src="assets/images/work.jpg"></div>
                     
                        </div>
                    </div>

                    <div class="col-md-6" id="article_right">
                        <a href="#index" class="btn btn-rabbit back"> <i class="fa fa-angle-left" aria-hidden="true"></i> Back to Home </a>
                                              <button type="submit" class="btn btn-rabbit submit">一年级</button>
                        <button type="submit" class="btn btn-rabbit submit">二年级</button>
                        <button type="submit" class="btn btn-rabbit submit">三年级</button>
                        <button type="submit" class="btn btn-rabbit submit">四年级</button>
                        <button type="submit" class="btn btn-rabbit submit">五年级</button>
                        <button type="submit" class="btn btn-rabbit submit">六年级</button>
                        <button type="submit" class="btn btn-rabbit submit">七年级</button>
                        <button type="submit" class="btn btn-rabbit submit">八年级</button>
                        <button type="submit" class="btn btn-rabbit submit">九年级</button>
                        
                        <form action="sixin.jsp">
                        <p class="info">      </p></form>
                    </div>
                </div>
            </div>    
        </div>                                                                 <!-- 课文原音 ends here  -->
        
        
		
		        <div id="work_scroll" class="pages">                                  <!-- Work starts here -->
            <div class="container main">
                <div class="row">
                    <div class="col-md-6" id="work_left">
                        <div id="owl-demo" class="owl-carousel owl-theme">
                            <div class="item"><img class="img-responsive img-rabbit" src="assets/images/work.jpg"></div>
                     
                        </div>
                    </div>

                    <div class="col-md-6" id="work_right">
                        <a href="#index" class="btn btn-rabbit back"> <i class="fa fa-angle-left" aria-hidden="true"></i> Back to Home </a>
                        <div id="watermark">
                            <h2 class="page-title" text-center>Others</h2>
                            <div class="marker">o</div>
                        </div>
                        <p class='subtitle'>请认真完成设定的目标哟!!</p>
                        <form action="sixin.jsp">
                        <p class="info">       <%
	try {
		Class.forName("com.mysql.jdbc.Driver");
	} catch (ClassNotFoundException e) {
		System.out.println("加载数据库驱动时抛出异常,内容如下:");
		e.printStackTrace();
	}
	Connection conn2 = DriverManager
			.getConnection(
	"jdbc:mysql://localhost/list?useUnicode=true&characterEncoding=utf8",
					"root", "123456");
	Statement stmt2 = conn2.createStatement();
	ResultSet rs2 = stmt2
			.executeQuery("select * from others");
	while (rs2.next()) {
		out.println("<br>"+"姓名: " + rs2.getString(2)+"<br>" + "电话:" + rs2.getString(3)+"<br>" + "	QQ:" + rs2.getString(4)+"<br>" +"微信:"+rs2.getString(5) +"<br>"+ "邮箱:"+rs2.getString(6)+"<br>"+ "个人简介:"+rs2.getString(7)+"<br>");
		out.println("<input type=submit value=私信  >");
	}
	rs2.close();
	stmt2.close();
	conn2.close();
%> </p></form>
                    </div>
                </div>
            </div>    
        </div>                                                                 <!-- Work ends here  -->
		
		
		
        
        <div id="contact_scroll" class="pages">                             <!-- Contact starts here -->
            <div class="container main">
                <div class="row">
                    <div class="col-md-6 left" id="contact_left">
                        <img class="img-responsive img-rabbit" src="assets/images/contact.jpg">
                    </div>

                    <div class="col-md-6 right" id="contact_right">
                        <a href="#index" class="btn btn-rabbit back"> <i class="fa fa-angle-left" aria-hidden="true"></i> Back to Home </a>
                        <div id="watermark">
                            <h2 class="page-title" text-center>Contact</h2>
                            <div class="marker">c</div>
                        </div>
                        <p class='subtitle'>你有什么问题可以联系我
                        </p>
                        <!-- form -->
                        <form class="form_edit" action="liuyan.jsp"> 
                            <div class="form-group">
                                <input type="text" name="name" class="form-control" id="exampleInputName" placeholder="Name">
                            </div>

                            <div class="form-group">
                            <input type="text" name="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
                            </div>

                            <div class="form-group">
                            <textarea class="form-control" name="message" rows="5" placeholder="Message"></textarea>
                            </div>
                            <button type="submit" class="btn btn-rabbit submit">Send Message</button>
                         
                         <br>
                         <br>
                         <div id="watermark">
                            <h2 class="page-title" text-center>Message</h2>
                            <div class="marker">m</div>
                        </div>
                         <p class='subtitle'>
                         <%
	try {
		Class.forName("com.mysql.jdbc.Driver");
	} catch (ClassNotFoundException e) {
		System.out.println("加载数据库驱动时抛出异常,内容如下:");
		e.printStackTrace();
	}
	Connection conn3 = DriverManager
			.getConnection(
	"jdbc:mysql://localhost/list?useUnicode=true&characterEncoding=utf8",
					"root", "123456");
	Statement stmt3 = conn3.createStatement();
	ResultSet rs3 = stmt3
			.executeQuery("select * from liuyan");
	while (rs3.next()) {
		out.println("<br>"+"姓名: " + rs3.getString(2)+"<br>" + "邮箱:" + rs3.getString(3)+"<br>" + "	message:" + rs3.getString(4)+"<br>");
	}
	rs3.close();
	stmt3.close();
	conn3.close();
%></p>
                        </form>
                    </div>
                </div>
            </div>
        </div>                                                              

        
        <!-- Contact ends here -->
        
        <script src="assets/js/jquery-3.1.0.min.js"></script>
        <script src="assets/js/bootstrap.min.js"></script>
        <script src="assets/js/script.js"></script>
    </body>
</html>
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值