JavaWeb JDBC小项目练习
提要：这是一个javaweb应用数据库进行增删查改的项目练习作业
技术应用：javaweb+mysql+Bootstrap
需用到的包：mysql-connector-java-8.0.11.jar
一、让我们先看看效果展示吧！
添加用户界面
查看用户界面（可选择查找方式，也于此页面进行删除、修改操作）
修改用户信息界面
二、代码详解
1、先建个包，然后建个Dbutil.java类。用于加载驱动，连接数据库，关闭数据库
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
public class DbUtil {
/**
* 声明数据库信息
*/
private static final String url="jdbc:MySQL://localhost:3306/homework?serverTimezone=UTC";
private static final String user="root";
private static final String password="123456";
/**
* 声明JDBC的相关对象
*/
protected static Statement s=null;
protected static ResultSet rs=null;
protected static Connection conn=null;
/**
* 创建数据库连接
* @return
* @throws ClassNotFoundException
*/
public static synchronized Connection getConnection(){
try {
Class.forName("com.mysql.cj.jdbc.Driver");
conn=DriverManager.getConnection(url,user,password);
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return conn;
}
/**
* 执行update,delete,insert
* @param sql
* @return
*/
public static int executeUpdate(String sql){
int result=0;
try {
s=getConnection().createStatement();
result=s.executeUpdate(sql);
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return result;
}
/**
* 执行select语句
* @param sql
* @return
*/
public static ResultSet executeQuery(String sql){
try {
s=getConnection().createStatement();
rs=s.executeQuery(sql);
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return rs;
}
/**
* 执行动态sql语句
* @param sql
* @return
*/
public static PreparedStatement executePrepareStatement(String sql){
PreparedStatement ps=null;
try {
ps=getConnection().prepareStatement(sql);
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return ps;
}
/**
* 事务回滚
*/
public static void rollback(){
try {
getConnection().rollback();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
/**
* 关闭数据库连接对象
*/
public static void close(){
try {
if(rs!=null)
rs.close();
if(s!=null)
s.close();
if(conn!=null)
conn.close();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}
2、界面：index.jsp(分成3部分：top,list,main)
<%@ 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>Insert title here</title>
</head>
<frameset rows="55,*" cols="*">
<frame src="top.jsp">
<frameset cols="95,*">
<frame src="list.jsp">
<frame src="main.jsp" name="show">
</frameset>
</frameset>
</html>
list.jsp
<%@ 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>Insert title here</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script></head>
<body>
<div class="dropdown">
<button type="button" class="btn dropdown-toggle" id="dropdownMenu1"
data-toggle="dropdown">
用户管理
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation">
<a role="menuitem" tabindex="-1" href="main.jsp" target="show">添加用户</a>
</li>
<li role="presentation">
<a role="menuitem" tabindex="-1" href="seeAll.jsp" target="show">查看用户</a>
</li>
</ul>
</div>
</body>
</html>
main.jsp(添加用户界面)
<%@ 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>Insert title here</title>
<script type="text/javascript" src="work.js">
</script>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script></head>
</head>
<body>
<form action="<%=request.getContextPath()%>/home4/add.jsp">
<table>
<tr>
<td align="right">用户名：</td>
<td><br><input type="text" name="username" id="txtUser" onblur="return checkForm()" class="form-control" ><br></td>
<td><span id="tips_username">*用户名由6-18位字符组成</span></td>
</tr>
<tr>
<td align="right">密 码：</td>
<td><input type="password" name="password" id="txtPsw" onblur="return checkForm()" class="form-control"><br></td>
<td><span id="tips_psw">*密码由6-18位字符组成，且必须包含字母，数字和标点符号</span></td>
</tr>
<tr>
<td align="right">确认密码：</td>
<td><input type="password" name="repsw" id="txtRepsw" onblur="return checkForm()" class="form-control"><br></td>
<td><span id="tips_repsw">*请再次输入密码</span></td>
</tr>
<tr>
<td align="right">用户类型：</td>
<td>
<select name="userclass" id="userclass" class="form-control">
<option value="学生">学生</option>
<option value="老师">老师</option>
</select><br>
</td>
</tr>
<tr>
<td align="right">性别：</td>
<td><input type="radio" name="sex" value="男" id="sex" checked="checked">男
<input type="radio" name="sex" value="女" id="sex">女<br></td>
<td><span id="tips_sexs">*请选择你的性别</span></td>
</tr>
<tr>
<td align="right">出生日期：</td>
<td><input type="date" name="date" id="date" class="form-control" value="年/月/日" ><br></td>
<td><span id="tip_date">*请选择你的出生日期，格式为 -年-月-日</span></td>
</tr>
<tr>
<td align="right">兴趣爱好:</td>
<td>
<input type="checkbox" name="hobby" id="hobby" value="阅读" >阅读
<input type="checkbox" name="hobby" id="hobby" value="音乐">音乐
<input type="checkbox" name="hobby" id="hobby" value="运动">运动<br>
</td>
<td><span id="tips_hobby">*请选择兴趣爱好</span></td>
</tr>
<tr>
<td align="right">电子邮件：</td>
<td><input type="text" name="email" id="email" onblur="return checkForm()" class="form-control" ><br></td>
<td><span id="tips_email"> *请输入邮箱</span></td>
</tr>
<tr>
<td align="right">自我介绍：</td>
<td><textarea rows="6" cols="30" name="textarea" id="textarea" onblur="return checkForm()" placeholder="......"></textarea></td>
<td><span id="tips_me">*限100字以内</span><td></td>
</tr>
<tr>
<td colspan="2" align="center"><br><input type="submit" value="提交" onclick="return change()" class="btn btn-default"></td>
</tr>
</table>
</form>
</body>
</html>
seeAll.jsp(显示用户信息界面)
<%@ 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>Insert title here</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script></head>
</head>
<body>
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">查找方式</a>
</div>
<div>
<form action="<%=request.getContextPath()%>/home4/search.jsp" class="navbar-form navbar-left" role="search">
<div id="search">
<select name="key" class="form-control">
<option value="name">用户名</option>
<option value="userclass">用户类型</option>
<option value="hobby">爱好</option>
<option value="sex">性别</option>
</select>
<input type="text" name="value" id="keyword" value="" class="form-control" placeholder="关键字">
<input type="submit" value="查询" class="btn btn-default">
<a href="main.jsp" target="show" class="btn btn-default navbar-btn">添加用户信息</a>
</div>
</form>
</div>
</div>
</nav>
<%
if(session.getAttribute("search")!=null&&session.getAttribute("search")!="") {
StringBuffer sb=(StringBuffer)session.getAttribute("search");
%>
<table class="table table-striped">
<thead>
<tr>
<td>用户名</td><td>用户类型</td><td>性别</td><td>兴趣爱好</td><td>电子邮件</td><td>自我介绍</td><td>出生日期</td><td>操作</td>
</tr>
</thead>
<tbody>
<% out.print(sb); %>
</tbody>
</table>
<%
}
%>
</body>
</html>
3、add.jsp(接收main.jsp数据，添加到数据库中，在转到seeAll.jsp中显示)
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.SQLException"%>
<%@page import="com.teng.homework.DbUtil"%>
<%@page import="java.sql.PreparedStatement"%>
<%@ 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>Insert title here</title>
</head>
<body>
<%
request.setCharacterEncoding("utf-8");
String username=request.getParameter("username");
String password=request.getParameter("password");
String userclass=request.getParameter("userclass");
String sex=request.getParameter("sex");
String email=request.getParameter("email");
String other=request.getParameter("textarea");
String[] hobbies=request.getParameterValues("hobby");
String hobby="";
for(int i=0;i<hobbies.length;i++){
hobby=hobby+" "+hobbies[i];
}
String date=request.getParameter("date");
//编写sql语句
String sql="insert into user(name,password,sex,hobby,email,other,userclass,date) values(?,?,?,?,?,?,?,?)";
int result=0;
try{
PreparedStatement ps=DbUtil.executePrepareStatement(sql);
ps.setString(1, username);
ps.setString(2, password);
ps.setString(3, sex);
ps.setString(4, hobby);
ps.setString(5, email);
ps.setString(6, other);
ps.setString(7, userclass);
ps.setString(8, date);
//执行sql语句
result=ps.executeUpdate();
ps.close();
}catch(SQLException e){
e.printStackTrace();
}
//如果查询成功，查询数据库
if(result>0){
//查询所有用户信息
String sqlSearch="select * from user";
ResultSet rs=null;
rs=DbUtil.executeQuery(sqlSearch);
StringBuffer sb=new StringBuffer();
try{
//遍历查询结果
while(rs.next()){
String name="";
name=rs.getString("name");
sb.append("<tr><td>");
sb.append(name);
sb.append("</td><td>");
sb.append(rs.getString("userclass"));
sb.append("</td><td>");
sb.append(rs.getString("sex"));
sb.append("</td><td>");
sb.append(rs.getString("hobby"));
sb.append("</td><td>");
sb.append(rs.getString("email"));
sb.append("</td><td>");
sb.append(rs.getString("other"));
sb.append("</td><td>");
sb.append(rs.getString("date"));
sb.append("</td><td>");
sb.append("<a href='delete.jsp?name="+name+"'>删除</a>");
sb.append(" ");
sb.append("<a href='update.jsp?name="+name+"'>修改</a>");
sb.append("</td></tr>");
}
DbUtil.close();
}catch(SQLException e){
e.printStackTrace();
}
//将查询结果存入session
session.setAttribute("search", sb);
response.sendRedirect("seeAll.jsp");
}
%>
</body>
</html>
4、search.jsp(根据查找方式，显示信息)
<%@page import="java.sql.SQLException"%>
<%@page import="com.teng.homework.DbUtil"%>
<%@page import="java.sql.ResultSet"%>
<%@ 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>Insert title here</title>
</head>
<body>
<%
String type=request.getParameter("key");
String keyword=request.getParameter("value");
String sqlsearch="select * from user";
if(keyword!=null){
sqlsearch="select * from user where "+type+" like'%"+keyword+"%'";
}
ResultSet rs=null;
rs=DbUtil.executeQuery(sqlsearch);
StringBuffer sb=new StringBuffer();
try{
while(rs.next()){
String name="";
name=rs.getString("name");
sb.append("<tr><td>");
sb.append(name);
sb.append("</td><td>");
sb.append(rs.getString("userclass"));
sb.append("</td><td>");
sb.append(rs.getString("sex"));
sb.append("</td><td>");
sb.append(rs.getString("hobby"));
sb.append("</td><td>");
sb.append(rs.getString("email"));
sb.append("</td><td>");
sb.append(rs.getString("other"));
sb.append("</td><td>");
sb.append(rs.getString("date"));
sb.append("</td><td>");
sb.append("<a href='delete.jsp?name="+name+"'>删除</a>");
sb.append(" ");
sb.append("<a href='update.jsp?name="+name+"'>修改</a>");
sb.append("</td></tr>");
}
DbUtil.close();
}catch(SQLException e){
e.printStackTrace();
}
session.setAttribute("search",sb);
response.sendRedirect("seeAll.jsp");
%>
</body>
</html>
5、删除用户（点击删除后，跳转到seeAll.jsp显示当前用户信息）
<%@page import="java.sql.SQLException"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="com.teng.homework.DbUtil"%>
<%@ 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>Insert title here</title>
</head>
<body>
<%
String username=request.getParameter("name");
String sql="delete from user where name='"+username+"'";
DbUtil.executeUpdate(sql);
String sqlsearch="select * from user";
ResultSet rs=null;
rs=DbUtil.executeQuery(sqlsearch);
StringBuffer sb=new StringBuffer();
try{
//遍历查询结果
while(rs.next()){
String name="";
name=rs.getString("name");
sb.append("<tr><td>");
sb.append(name);
sb.append("</td><td>");
sb.append(rs.getString("userclass"));
sb.append("</td><td>");
sb.append(rs.getString("sex"));
sb.append("</td><td>");
sb.append(rs.getString("hobby"));
sb.append("</td><td>");
sb.append(rs.getString("email"));
sb.append("</td><td>");
sb.append(rs.getString("other"));
sb.append("</td><td>");
sb.append(rs.getString("date"));
sb.append("</td><td>");
sb.append("<a href='delete.jsp?name="+name+"'>删除</a>");
sb.append(" ");
sb.append("<a href='update.jsp?name="+name+"'>修改</a>");
sb.append("</td></tr>");
}
DbUtil.close();
}catch(SQLException e){
e.printStackTrace();
}
//将查询结果存入session
session.setAttribute("search", sb);
response.sendRedirect("seeAll.jsp");
%>
</body>
</html>
6、update.jsp(点击修改后跳至此页面，显示要修改用户信息，进行修改)
<%@page import="com.teng.homework.DbUtil"%>
<%@page import="java.sql.ResultSet"%>
<%@ 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>
<script type="text/javascript" src="work.js">
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script></head>
</head>
<body>
<%
String name=request.getParameter("name");
String sql="select * from user where name='"+name+"'";
ResultSet rs=DbUtil.executeQuery(sql);
String username="",other="",email="",userclass="",sex="",hobby="",date="";
while(rs.next()){
username=rs.getString("name");
other=rs.getString("other");
email=rs.getString("email");
userclass=rs.getString("userclass");
sex=rs.getString("sex");
hobby=rs.getString("hobby");
date=rs.getString("date");
}
DbUtil.close();
%>
<form action="<%=request.getContextPath()%>/home4/update2.jsp?nameid=<%=name %>" method="post">
<table>
<tr>
<td align="right">用户名：</td>
<td><br><input type="text" name="username" id="txtUser" value="<%=username%>" class="form-control" onblur="return checkForm()"><br></td>
<td><span id="tips_username">*用户名由6-18位字符组成</span></td>
</tr><tr>
<td align="right">性别：</td>
<td><input type="radio" name="sex" value="男" <%if(sex.equals("男")) out.print("checked"); %> >男
<input type="radio" name="sex" value="女" <%if(sex.equals("女")) out.print("checked"); %>>女<br></td>
<td><span id="tips_sexs">*请选择你的性别</span></td>
</tr>
<tr>
<td align="right">用户类型：</td>
<td>
<select name="userclass" class="form-control">
<option value="学生" <%if(userclass.equals("学生")) out.print("selected='true'"); %>>学生</option>
<option value="老师" <%if(userclass.equals("老师")) out.print("selected='true'"); %>>老师</option>
</select><br>
</td></tr><tr>
<td align="right">兴趣爱好：</td><td>
<input type="checkbox" name="hobby" value="阅读" <% if(hobby.indexOf("阅读")>=0) out.print("checked"); %>>阅读
<input type="checkbox" name="hobby" value="音乐" <% if(hobby.indexOf("音乐")>=0) out.print("checked"); %>>音乐
<input type="checkbox" name="hobby" value="运动" <% if(hobby.indexOf("运动")>=0) out.print("checked"); %>>运动
</td>
<td><span id="tips_hobby">*请选择兴趣爱好</span></td>
</tr>
<tr>
<td align="right">出生日期：</td>
<td><input type="date" name="date" value="<%=date%>" id="date" class="form-control"><br></td>
<td><span id="tip_date">*请选择你的出生日期，格式为 -年-月-日</span></td>
</tr>
<tr>
<td align="right">邮箱：</td>
<td><input type="text" name="email" value="<%=email%>" id="email" class="form-control" onblur="return checkForm()"><br></td>
<td><span id="tips_email"> *请输入邮箱</span></td>
</tr>
<tr>
<td align="right">自我介绍：</td>
<td><textarea rows="6" cols="30" name="textarea" id="textarea" placeholder="......" onblur="return checkForm()"><%=other %></textarea></td>
<td><span id="tips_me">*限100字以内</span><td></td>
</tr>
<tr><td colspan="2" align="center"><input type="submit" value="提交" onclick="return change()"></td></tr>
</table>
</form>
</body>
</html>
7、update2.jsp(update.jsp后的中转页面，用于执行数据库的修改操作，并跳至seeAll.jsp显示当前用户信息)
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.SQLException"%>
<%@page import="com.teng.homework.DbUtil"%>
<%@page import="java.sql.PreparedStatement"%>
<%@ 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>Insert title here</title>
</head>
<body>
<%
request.setCharacterEncoding("utf-8");
String username=request.getParameter("nameid");
String name=request.getParameter("username");
String sex=request.getParameter("sex");
String userclass=request.getParameter("userclass");
String[] hobbies=request.getParameterValues("hobby");
String hobby="";
for(int i=0;i<hobbies.length;i++){
hobby=hobby+" "+hobbies[i];
}
String email=request.getParameter("email");
String other=request.getParameter("textarea");
String date=request.getParameter("date");
//编写sql
String sql="update user set name=?,sex=?,userclass=?,hobby=?,email=?,other=?,date=? where name='"+username+"'";
int result=0;
try{
PreparedStatement ps=DbUtil.executePrepareStatement(sql);
ps.setString(1, name);
ps.setString(2, sex);
ps.setString(3, userclass);
ps.setString(4, hobby);
ps.setString(5, email);
ps.setString(6, other);
ps.setString(7, date);
//执行sql语句
result=ps.executeUpdate();
ps.close();
}catch(SQLException e){
e.printStackTrace();
}
if(result>0){
//查询所有用户信息
String sqlSearch="select * from user";
ResultSet rs=null;
rs=DbUtil.executeQuery(sqlSearch);
StringBuffer sb=new StringBuffer();
try{
//遍历查询结果
while(rs.next()){
String name1="";
name1=rs.getString("name");
sb.append("<tr><td>");
sb.append(name1);
sb.append("</td><td>");
sb.append(rs.getString("userclass"));
sb.append("</td><td>");
sb.append(rs.getString("sex"));
sb.append("</td><td>");
sb.append(rs.getString("hobby"));
sb.append("</td><td>");
sb.append(rs.getString("email"));
sb.append("</td><td>");
sb.append(rs.getString("other"));
sb.append("</td><td>");
sb.append(rs.getString("date"));
sb.append("</td><td>");
sb.append("<a href='delete.jsp?name="+name1+"'>删除</a>");
sb.append(" ");
sb.append("<a href='update.jsp?name="+name1+"'>修改</a>");
sb.append("</td></tr>");
}
DbUtil.close();
}catch(SQLException e){
e.printStackTrace();
}
//将查询结果存入session
session.setAttribute("search", sb);
response.sendRedirect("seeAll.jsp");
}
%>
</body>
</html>
8.word.js(javascript方法，用于表单的验证)
function checkForm(){
if(document.getElementById("txtUser").value.length<6||document.getElementById("txtUser").value.length>18){
document.getElementById("tips_username").innerHTML="<em style='color:#FF0000'>用户名由6-18为字符组成</em>";
document.getElementById("txtUser").focus();
return false;
}else{
document.getElementById("tips_username").innerHTML="<em style='color:#FF0000'>OK！</em>";
}
var reg=/[^A-Za-z0-9_]+/;
var regs= /^[a-zA-Z0-9_\u4e00-\u9fa5]+$/;
if(document.getElementById("txtPsw").value.length<6||document.getElementById("txtPsw").value.length>18||regs.test(document.getElementById("txtPsw").value)){
document.getElementById("tips_psw").innerHTML="<em style='color:#FF0000'>密码由6-18为字符组成，且必须包含字母，数字和标点符号</em>";
document.getElementById("txtPsw").focus();
return false;
}else{
document.getElementById("tips_psw").innerHTML="<em style='color:#FF0000'>OK！</em>";
}
if(document.getElementById("txtRepsw").value!=document.getElementById("txtPsw").value){
document.getElementById("tips_repsw").innerHTML="<em style='color:#FF0000'>两次输入的密码不相同</em>";
document.getElementById("txtRepsw").focus();
return false;
}else{
document.getElementById("tips_repsw").innerHTML="<em style='color:#FF0000'>OK！</em>";
}
var email=document.getElementById("email").value;
var pattern=/^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/;
if(email==""){
document.getElementById("tips_email").innerHTML="<em style='color:#FF0000'>电子邮箱不能为空</em>";
document.getElementById("email").focus();
return false;
}else if(!pattern.test(email)){
document.getElementById("tips_email").innerHTML="<em style='color:#FF0000'>电子邮箱不合法</em>";
document.getElementById("email").focus();
return false;
}else{
document.getElementById("tips_email").innerHTML="<em style='color:#FF0000'>OK！</em>";
}
if(document.getElementById("textarea").value.length>100){
document.getElementById("tips_me").innerHTML="<em style='color:#FF0000'>长度不能超过100个字符</em>";
document.getElementById("textarea").focus();
return false;
}else if(document.getElementById("textarea").value!=""&&document.getElementById("textarea").value!=null){
document.getElementById("tips_me").innerHTML="<em style='color:#FF0000'>OK！</em>";
}
}
function change(){
if(document.getElementById("txtUser").value==""||document.getElementById("txtUser").value==null){
alert("请填写完整信息");
document.getElementById("txtUser").focus();
return false;
}
var c=document.getElementById("date").value;
if(c==""||c==null){
alert("请填写出生日期");
document.getElementById("tip_date").innerHTML="<em style='color:#FF0000'>请填入出生日期</em>";
document.getElementById("date").focus();
return false;
}
}
最后，这是我的工程目录
374
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
