登录小项目 js+servlet+jdbc+mvc

项目名称：
沪上阿姨
实现需求:
实现用户登录
实现用户退出
实现用户注册
功能分析：
用户登录：
根据用户名和密码查询用户信息。查询则登录成功，查不到则登录失败。
用户退出：
销毁session
用户注册：
将用户注册信息插入数据库
数据库设计：
用户表：
用户id
用户名
用户密码：
用户性别；
用户年龄：
SQL语句设计：
用户登录
select * from t_user where uname and pwd=?
用户注册：
insert into t_user values(default,?,?,?,?,?)
------------------------------------------------------------------------------
问题：
现在我们一个请求或者一个独立的业务逻辑都单独进行一个Servlet的创建进行请求处理。
但是一个网站的功能是非常的多，如果每个都创建单独的Servlet进行处理，这样造成Servlet过多。造成资源浪费。
解决：
服务器在接收到浏览器发送的请求后，会调用对应的servlet进行请求处理。
然后调用servlet中的servelt方法进行处理。
在servlet方法中调用其对应的功能处理方法进行请求处理 。
这样servlet我们只需要一个就可以了。

新的问题：
如何在service方法中实现根据请求动态的调用其功能处理方法呢？
解决：
使用反射
注意：
请求中需要附带要执行的方法名称。
-------------------------------------------------------------------------
问题二：
现在使用反射我们实现了在servlet方法中动态的根据请求调用对应的方法进行处理
但是真实开发过程中，虽然不会每个功能都创建一个servlet，但是也不会只使用一个servlet，我们servlet也不只一个，
一般是一个独立功能的模块一个servlet。我们需要在这些servlet的service方法中将反射代码声明一遍。
解决：
向上抽取BaseServlet类
实现：
我们自己得servlet--->
向上抽取父类BaseServlet(service)
注意: 我们希望BaseServlet不能被访问到(不能web.xml中配置BaseServlet)
我们希望BaseServlet不能被实例化（改为抽象类）
--------------->HttpServlet
BaseServlet使用：
1.创建Servlet继承BaseServlet即可
2.在自己得servlet中不要声明service方法，只要书写请求处理功能方法即可。
3.正常访问自己的servlet
注意：
请求必须附带被执行得方法名。
------------------------------------------------------------------------
JSP+Servlet项目整合练习总结和期望：
总结：
1.套用模板进行页面快速构建
在自己的项目中创建jsp文件
然后将模板中的前端相关代码赋值到自己的jsp文件中
将静态资源复制到 webRoot下
2.MVC的开发流程
M：model service dao pojo
v：view jsp js css html
c:control Servlet
3. Servlet+jsp+jdbc的功能开发数据流程
1.浏览器发起页面请求直接给jsp
2.浏览器发送功能请求给servlet. servlet调用service 。service进行业务逻辑处理，
service调用dao。dao层进程数据库操作（jdbc）。dao层将处理结果返回service
service再将结果返回给servlet，请求转发或者重定向给jsp。jsp做出页面响应。

4.request和session 作用域的使用
5.浏览器发起请求到服务器请求发起的方式
6.BaseServlet的抽取和使用。
--------------------------------------------------------
项目缺陷：
1.在jsp中获取从servelt流转过来的数据特别麻烦
2.在jsp页面中使用java代码块进行逻辑处理书写和阅读不方便
3.使用session进行数据流转是很方便的，但是session失效了，所有依赖session的功能都会出问题。
4.响应结果都是覆盖原有内容显示给用户。

代码如下：

Dao

package wq.dao.impl;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;




import wq.dao.UserDao;
import wq.util.DBUtil;
import wq.pojo.*;


public class UserDaoImpl implements UserDao {
    //查询用户信息
    @Override
    public User getUserInfoDao(String uname, String pwd) {
        //声明jdbc变量
        Connection conn=null;
        PreparedStatement ps=null;
        ResultSet rs=null;
        //声明变量
        User u=null;
        try {
            //创建连接
            conn=DBUtil.getConnection();
            //创建SQL命令
            String sql="select * from t_user where uname=? and pwd=?";
            //创建SQL命令对象
            ps=conn.prepareStatement(sql);
            //给占位符赋值
            ps.setString(1,uname);
            ps.setString(2, pwd);
            //执行SQL命令
            rs=ps.executeQuery();
            //遍历
            while(rs.next()){
                //给变量赋值
                u=new User();

                u.setUid(rs.getInt("uid"));
                u.setUname(rs.getString("uname"));
                u.setPwd(rs.getString("pwd"));
                u.setSex(rs.getString("sex"));
                u.setAge(rs.getInt("age"));
                u.setBirthday(rs.getString("birthday"));
            }
        } catch (Exception e) {
            e.printStackTrace();
        }finally{//关闭资源
            DBUtil.closeAll(rs, ps, conn);
        }
        //返回结果
        return u;
    }
     //用户注册
    @Override
    public int regUserinfoService(String uname, String pwd, String sex,
            int age, String birthday) {
        String sql="insert into t_user values(default,?,?,?,?,?)";
      
        return DBUtil.executeDML(sql, uname,pwd,sex,age,birthday);
    }
    
    
}

package wq.dao;

import wq.pojo.User;



public interface UserDao {
    /**
     * 根据用户名和密码查询用户信息
     * @author Administrator
     *
     */
    User getUserInfoDao(String uname, String pwd);
/**
 * 用户注册
 * @param uname
 * @param pwd
 * @param sex
 * @param age
 * @param birthday
 * @return
 */
    
    int regUserinfoService(String uname, String pwd, String sex, int age,
            String birthday);
    
}

User

package wq.pojo;

public class User {
    private int uid;
    private String uname;
    private String pwd;
    private String sex;
    private int age;
    private String birthday;
    public int getUid() {
        return uid;
    }
    public void setUid(int uid) {
        this.uid = uid;
    }
    public String getUname() {
        return uname;
    }
    public void setUname(String uname) {
        this.uname = uname;
    }
    public String getPwd() {
        return pwd;
    }
    public void setPwd(String pwd) {
        this.pwd = pwd;
    }
    public String getSex() {
        return sex;
    }
    public void setSex(String sex) {
        this.sex = sex;
    }
    public int getAge() {
        return age;
    }
    public void setAge(int age) {
        this.age = age;
    }
    public String getBirthday() {
        return birthday;
    }
    public void setBirthday(String birthday) {
        this.birthday = birthday;
    }
    @Override
    public String toString() {
        return "User [uid=" + uid + ", uname=" + uname + ", pwd=" + pwd
                + ", sex=" + sex + ", age=" + age + ", birthday=" + birthday
                + "]";
    }
    @Override
    public int hashCode() {
        final int prime = 31;
        int result = 1;
        result = prime * result + age;
        result = prime * result
                + ((birthday == null) ? 0 : birthday.hashCode());
        result = prime * result + ((pwd == null) ? 0 : pwd.hashCode());
        result = prime * result + ((sex == null) ? 0 : sex.hashCode());
        result = prime * result + uid;
        result = prime * result + ((uname == null) ? 0 : uname.hashCode());
        return result;
    }
    @Override
    public boolean equals(Object obj) {
        if (this == obj)
            return true;
        if (obj == null)
            return false;
        if (getClass() != obj.getClass())
            return false;
        User other = (User) obj;
        if (age != other.age)
            return false;
        if (birthday == null) {
            if (other.birthday != null)
                return false;
        } else if (!birthday.equals(other.birthday))
            return false;
        if (pwd == null) {
            if (other.pwd != null)
                return false;
        } else if (!pwd.equals(other.pwd))
            return false;
        if (sex == null) {
            if (other.sex != null)
                return false;
        } else if (!sex.equals(other.sex))
            return false;
        if (uid != other.uid)
            return false;
        if (uname == null) {
            if (other.uname != null)
                return false;
        } else if (!uname.equals(other.uname))
            return false;
        return true;
    }
    public User() {
        super();
        // TODO Auto-generated constructor stub
    }
    public User(int uid, String uname, String pwd, String sex, int age,
            String birthday) {
        super();
        this.uid = uid;
        this.uname = uname;
        this.pwd = pwd;
        this.sex = sex;
        this.age = age;
        this.birthday = birthday;
    }
    
    
    
    
    
    
    
}

service

package wq.service.impl;



import wq.dao.UserDao;
import wq.dao.impl.UserDaoImpl;
import wq.pojo.User;
import wq.service.UserService;

public  class UserServiceImpl implements UserService{

    //创建Dao层对象
    UserDao ud=new UserDaoImpl();
    @Override
    public User getUserInfoService(String uname, String pwd) {
    
        //处理登录业务
      return ud.getUserInfoDao(uname, pwd);
    }
    @Override
    public int reqUserinfoService(String uname, String pwd, String sex,
            int age, String birthday) {
        //处理注册业务
                return ud.regUserinfoService(uname,pwd,sex,age,birthday);
        
    }

}

package wq.service;

import wq.pojo.User;



public interface UserService {
/**
 * 用户登录
 * @param uname
 * @param pwd
 * @return
 */
    User getUserInfoService(String uname, String pwd);
    /**
     * 用户注册
     * @param uname
     * @param pwd
     * @param sex
     * @param age
     * @param birthday
     * @return 
     */

int reqUserinfoService(String uname, String pwd, String sex, int age,
        String birthday);
   
}

servlet

package wq.servlet;

import java.io.IOException;
import java.lang.reflect.Method;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public abstract class BaseServlet extends HttpServlet {
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
                //设置请求编码格式
                req.setCharacterEncoding("utf-8");
                //设置响应编码格式
                resp.setContentType("text/html;charset=utf-8");
                //获取请求信息
                String methodName=req.getParameter("method");
                //调用方法处理请求（动态根据方法名调用方法--->反射）
                try {
                    //反射获取方法所在的类的类对象
                    Class cla=this.getClass();
                    //反射获取要被调用的方法对象
                    Method m=cla.getMethod(methodName, HttpServletRequest.class,HttpServletResponse.class);
                    //反射执行方法
                    m.invoke(this, req,resp);
                } catch (Exception e) {
                    e.printStackTrace();
                }    
    }
}

package wq.servlet;



import java.io.IOException;
import java.lang.reflect.Method;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import wq.pojo.User;
import wq.service.UserService;
import wq.service.impl.UserServiceImpl;
/***
 * servlet创建一个，在service方法中动态的调用请求处理方法。
 * 注意：
 *     请求中需要附带要调用的方法名
 * 
 * 
 * 
 * @author MyPC
 *
 */
public class DataServlet extends BaseServlet {
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
        //设置请求编码格式
        req.setCharacterEncoding("utf-8");
        //设置响应编码格式
        resp.setContentType("text/html;charset=utf-8");
        //获取请求信息
        String methodName=req.getParameter("method");
        System.out.println("DataServlet.service(当前请求方法名为:)"+methodName);
        //调用方法处理请求（动态根据方法名调用方法--->反射）
        try {
            //反射获取方法所在的类的类对象
            Class cla=this.getClass();
            //反射获取要被调用的方法对象
            Method m=cla.getMethod(methodName, HttpServletRequest.class,HttpServletResponse.class);
            //反射执行方法
            m.invoke(this, req,resp);
        } catch (Exception e) {
            e.printStackTrace();
        }    
    }
    //登录处理方法
    public void userLogin(HttpServletRequest req, HttpServletResponse resp) throws IOException{
        System.out.println("DataServlet.userLogin(开始处理用户登录请求)");
        //获取请求信息
                String uname=req.getParameter("uname");
                String pwd=req.getParameter("pwd");
                //处理请求信息
                    System.out.println(uname+":"+pwd);
                    //创建业务层对象
                    UserService us=new UserServiceImpl();
                    User u=us.getUserInfoService(uname,pwd);
                    System.out.println("用户登录查询结果为:"+u);
                //响应处理结果
                    //创建或者获取session对象
                    HttpSession hs=req.getSession();
                    if(u!=null){//登录成功
                        //将用户信息存储到session中
                        hs.setAttribute("user",u);
                        //重定向到main.jsp
                        resp.sendRedirect("/project2/main.jsp");
                    }else{//登录失败
                        
                        //将登录失败的标记添加到session中
                        hs.setAttribute("flag", "loginFalse");
                        //重定向到login.jsp
                        resp.sendRedirect("/project2/login.jsp");
                    }
    }
    //退出处理方法
    public void userOut(HttpServletRequest req, HttpServletResponse resp) throws IOException{
        System.out.println("DataServlet.userOut(用户退出开始处理)");
            //获取请求信息
                //处理请求信息
                    //获取session
                    HttpSession hs = req.getSession();
                    //销毁session    
                    hs.invalidate();
                //响应处理结果
                    //重定向
                    resp.sendRedirect("/project2/login.jsp");
        
        
    }
    //注册处理方法
    public void userReg(HttpServletRequest req, HttpServletResponse resp) throws IOException{
        System.out.println("DataServlet.userReg(用户注册开始处理)");
        //获取请求信息
                String uname=req.getParameter("uname");
                String pwd=req.getParameter("pwd");
                String sex=req.getParameter("sex");
                int age=Integer.parseInt(req.getParameter("age"));
                String birthday=req.getParameter("birthday");
                //处理请求信息
                    //获取业务层对象
                    UserService us=new UserServiceImpl();
                    //处理注册
                    int i=us.reqUserinfoService(uname,pwd,sex,age,birthday);
                //响应处理结果
                    //获取Session对象
                    HttpSession hs=req.getSession();
                    //重定向到登录页面
                    if(i>0){
                        //给注册成功添加标记到session中
                        hs.setAttribute("flag", "regSuccess");
                        resp.sendRedirect("/project2/login.jsp");
                    }else{
                        //重定向到注册页面
                        resp.sendRedirect("/project2/login.jsp");
                    }
    }
    
}

DBUtil

package wq.util;

import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.Properties;

public class DBUtil {
    //声明全局变量记录jdbc参数
    private static String driver;
    private static String url;
    private static String username;
    private static String password;
    //使用静态代码块，在类加载时即完成对属性文件的读取
    static{
        //动态获取属性配置文件的流对象
        InputStream in=DBUtil.class.getResourceAsStream("/db.properties");
        //创建Properties对象
        Properties p=new Properties();
        //加载
        try {
            p.load(in);//会将属性配置文件的所有数据存储到Properties对象中
            //将读取的jdbc参数赋值给全局变量
            driver=p.getProperty("driver");
            url=p.getProperty("url");
            username=p.getProperty("username");
            password=p.getProperty("password");
            //加载驱动
            Class.forName(driver);
        } catch (IOException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        } catch (ClassNotFoundException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
    }
    //创建连接对象并返回
    public static Connection getConnection(){
        Connection conn=null;
        try {
            conn = DriverManager.getConnection(url, username, password);
        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        
        return conn;
    }
    //关闭资源
    public static void closeAll(ResultSet rs,Statement stmt,Connection conn){
        try {
            if(rs!=null){
                rs.close();
            }
        } catch (SQLException e1) {
            // TODO Auto-generated catch block
            e1.printStackTrace();
        }
        try {
            stmt.close();
        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        try {
            conn.close();
        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        
        
    }
    //封装增加删除修改的通用工具方法
    /**
     * @param sql SQL语句
     * @param objs    SQL语句占位符实参，如果没有参数则传入null
     * @return 返回增删改的结果，类型为int
     */
    public static int executeDML(String sql,Object...objs){
        // 声明jdbc变量
                Connection conn = null;
                PreparedStatement ps = null;
                int i = -1;
                try {
                    // 获取连接对象
                    conn = DBUtil.getConnection();
                    // 开启事务管理
                    conn.setAutoCommit(false);
                    // 创建SQL命令对象
                    ps = conn.prepareStatement(sql);
                    // 给占位符赋值
                    if(objs!=null){
                        for(int j=0;j<objs.length;j++){
                            ps.setObject(j+1,objs[j]);
                        }
                    }
                    // 执行SQL
                    i = ps.executeUpdate();
                    conn.commit();
                } catch (Exception e) {
                    try {
                        conn.rollback();
                    } catch (SQLException e1) {
                        // TODO Auto-generated catch block
                        e1.printStackTrace();
                    }
                    e.printStackTrace();
                } finally {
                    DBUtil.closeAll(null, ps, conn);
                }
                return i;
    }
    
    
    
}

db.properties

driver=com.mysql.jdbc.Driver
url=jdbc:mysql://localhost:3306/project
username=root
password=root

前端部分代码

login.jsp

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!-- 
    添加前端代码书写插件
        插件在资料中，将查询包放到myEclipse的安装目录中的drops文件中，然后重启myEclipse即可。
        安装后快捷键为:ctrl+E
    模版套用:
        在自己的项目中创建模版对应的jsp文件
        将jsp文件中的basepath代码移动到其他位置
        然后将模版中的HTML代码整个复制到对应的jsp中
        然后将basepath在移动会head标签中
        将模版中的前端资源文件复制到webRoot下。
 --> 
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <base href="<%=basePath%>">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="renderer" content="webkit">
    <title>登录</title>  
    <link rel="stylesheet" href="css/pintuer.css">
    <link rel="stylesheet" href="css/admin.css">
    <script src="js/jquery.js"></script>
    <script src="js/pintuer.js"></script>  
</head>
<body>
<div class="bg"></div>
<div class="container">
    <div class="line bouncein">
        <div class="xs6 xm4 xs3-move xm4-move">
            <div style="height:150px;"></div>
            <div class="media media-y margin-big-bottom">           
            </div>         
            <form action="data" method="post">
            <!-- 声明请求处理方法 -->
            <input type="hidden" name="method" value="userLogin"/>
            <div class="panel loginbox">
                <div class="text-center margin-big padding-big-top"><h1>尚学堂后台管理中心</h1></div>
                <!--声明java代码块  -->
                        <%
                        //获取session中的标记
                        Object obj=session.getAttribute("flag");
                        if(obj!=null){
                            if("loginFalse".equals((String)obj)){
                                %> 
                                     <div style="text-align: center;color:red;">用户名或密码错误</div>
                                 <%
                             }else if("regSuccess".equals((String)obj)){
                             %>
                                 <div style="text-align: center;color:red;">用户注册成功</div>
                             <%
                             }
                        }    
                         session.invalidate();
                     %> 
                <div class="panel-body" style="padding:30px; padding-bottom:10px; padding-top:10px;">
                    <div class="form-group">
                        <div class="field field-icon-right">
                            <input type="text" class="input input-big" name="uname" placeholder="登录账号" data-validate="required:请填写账号" />
                            <span class="icon icon-user margin-small"></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="field field-icon-right">
                            <input type="password" class="input input-big" name="pwd" placeholder="登录密码" data-validate="required:请填写密码" />
                            <span class="icon icon-key margin-small"></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="field">
                            <input type="text" class="input input-big" name="code" placeholder="填写右侧的验证码" data-validate="required:请填写右侧的验证码" />
                           <img src="images/passcode.jpg" alt="" width="100" height="32" class="passcode" style="height:43px;cursor:pointer;" onclick="this.src=this.src+'?'">                         
                        </div>
                    </div>
                </div>           
                <div style="padding:30px;"><input type="submit" class="button button-block bg-main text-big input-big" value="登录"></div>
                <div style="font-size: 15px;position: relative;left:300px;top:-20px;"><a href="register.jsp">注册</a></div>
            </div>
            </form>          
        </div>
    </div>
</div>
</body>
</html>

main.jsp

<%@ page language="java" import="java.util.*,wq.pojo.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <base href="<%=basePath%>">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="renderer" content="webkit">
    <title>后台管理中心</title>  
    <link rel="stylesheet" href="css/pintuer.css">
    <link rel="stylesheet" href="css/admin.css">
    <script src="js/jquery.js"></script>   
    <!--声明js代码域  -->
    <script type="text/javascript">
        $(function(){
            //给退出登录添加单击事件
            $("#out").click(function(){
                return window.confirm("你真的要退出吗?");
            })
        })
    
    </script>
    
    
    
</head>
<body style="background-color:#f2f9fd;">
<div class="header bg-main">
  <div class="logo margin-big-left fadein-top">
    <h1><img src="images/y.jpg" class="radius-circle rotate-hover" height="50" alt="" />尚学堂后台管理中心</h1>
  </div>
  <div class="head-l" style="position: relative;left:850px;"><span style="font-size: 15px;color:white;">当前用户:<%=((User)session.getAttribute("user")).getUname()%></span>&nbsp;&nbsp;<a id="out" class="button button-little bg-red" href="data?method=userOut"><span class="icon-power-off"></span> 退出登录</a> </div>
</div>
<div class="leftnav">
  <div class="leftnav-title"><strong><span class="icon-list"></span>菜单列表</strong></div>
  <h2><span class="icon-user"></span>基本设置</h2>
  <ul style="display:block">
    <li><a href="info.html" target="right"><span class="icon-caret-right"></span>网站设置</a></li>
    <li><a href="pass.html" target="right"><span class="icon-caret-right"></span>修改密码</a></li>
    <li><a href="page.html" target="right"><span class="icon-caret-right"></span>单页管理</a></li>  
    <li><a href="adv.html" target="right"><span class="icon-caret-right"></span>首页轮播</a></li>   
    <li><a href="book.html" target="right"><span class="icon-caret-right"></span>留言管理</a></li>     
    <li><a href="column.html" target="right"><span class="icon-caret-right"></span>栏目管理</a></li>
  </ul>   
  <h2><span class="icon-pencil-square-o"></span>栏目管理</h2>
  <ul>
    <li><a href="list.html" target="right"><span class="icon-caret-right"></span>内容管理</a></li>
    <li><a href="add.html" target="right"><span class="icon-caret-right"></span>添加内容</a></li>
    <li><a href="cate.html" target="right"><span class="icon-caret-right"></span>分类管理</a></li>        
  </ul>  
</div>
<script type="text/javascript">
$(function(){
  $(".leftnav h2").click(function(){
      $(this).next().slideToggle(200);    
      $(this).toggleClass("on"); 
  })
  $(".leftnav ul li a").click(function(){
        $("#a_leader_txt").text($(this).text());
          $(".leftnav ul li a").removeClass("on");
        $(this).addClass("on");
  })
});
</script>
<ul class="bread">
  <li><a href="{:U('Index/info')}" target="right" class="icon-home"> 首页</a></li>
  <li><a href="##" id="a_leader_txt">网站信息</a></li>
  <li><b>当前语言：</b><span style="color:red;">中文</php></span>
  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;切换语言：<a href="##">中文</a> &nbsp;&nbsp;<a href="##">英文</a> </li>
</ul>
<div class="admin">
  <iframe scrolling="auto" rameborder="0" src="info.jsp" name="right" width="100%" height="100%"></iframe>
</div>
<div style="text-align:center;">
<p>来源:<a href="http://www.mycodes.net/" target="_blank">源码之家</a></p>
</div>
</body>
</html>

register.jsp

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="renderer" content="webkit">
<title></title>
<link rel="stylesheet" href="css/pintuer.css">
<link rel="stylesheet" href="css/admin.css">
<script src="js/jquery.js"></script>
<script src="js/pintuer.js"></script>
<!--声明js代码域  -->
<script type="text/javascript">
    $(function(){
        //给男添加单击事件
        $("#man").click(function(){
            
            //将男的选择状态加上
            $("#manSpan").addClass("icon-check");
            //给女的span删除选择样式
            $("#womanSpan").removeClass("icon-check");
        })
        
        //给女添加单击事件
        $("#woman").click(function(){
            //给女的span添加选择样式
            $("#womanSpan").addClass("icon-check");
            //将男的选择状态去掉
            $("#manSpan").removeClass("icon-check");
        })
    })
</script>
</head>
<body>
    <div class="panel admin-panel">
        <div class="panel-head">
            <strong><span class="icon-key"></span>用户注册</strong>
        </div>
        <div class="body-content">
            <form method="post" class="form-x" action="data">
                <!--声明请求的方法名  -->
                <input type="hidden" name="method" value="userReg" />
                <div class="form-group">
                    <div class="label">
                        <label for="sitename">用户名：</label>
                    </div>
                    <div class="field">
                        <input type="text" class="input w50" id="mpass" name="uname"
                            size="50" placeholder="请输入用户名" data-validate="required:请输入用户名" />
                    </div>
                </div>
                <div class="form-group">
                    <div class="label">
                        <label for="sitename">新密码：</label>
                    </div>
                    <div class="field">
                        <input type="password" class="input w50" name="pwd" size="50"
                            placeholder="请输入新密码"
                            data-validate="required:请输入新密码,length#>=5:新密码不能小于5位" />
                    </div>
                </div>
                <div class="form-group">
                    <div class="label">
                        <label for="sitename">确认新密码：</label>
                    </div>
                    <div class="field">
                        <input type="password" class="input w50"
                            size="50" placeholder="请再次输入新密码"
                            data-validate="required:请再次输入新密码,repeat#pwd:两次输入的密码不一致" />
                    </div>
                </div>
                <!-- 性别 -->
                <div class="form-group">
                    <div class="label">
                      <label>性别：</label>
                    </div>
                    <div class="field">
                      <div class="button-group radio">
                      
                      <label class="button active">
                           <span class="icon-check" id="manSpan"></span>             
                          <input name="sex" value="1" id="man" type="radio" checked="checked">男         
                      </label>             
                    
                      <label class="button active" ><span class="" id="womanSpan"></span>              
                          <input name="sex" value="0" id="woman" type="radio">女
                      </label>         
                       </div>       
                    </div>
                 </div>
                <!-- 年龄 -->
                <div class="form-group">
                    <div class="label">
                        <label for="sitename">用户年龄：</label>
                    </div>
                    <div class="field">
                        <input type="text" class="input w50" id="mpass" name="age"
                            size="50" placeholder="请输入年龄" data-validate="required:请输入年龄" />
                    </div>
                </div>
                <!--出生日期  -->
                <div class="form-group">
                    <div class="label">
                        <label for="sitename">出生日期：</label>
                    </div>
                    <div class="field">
                        <input type="date" class="input w50" id="mpass" name="birthday"
                            size="50"  />
                    </div>
                </div>
                <div class="form-group">
                    <div class="label">
                        <label></label>
                    </div>
                    <div class="field">
                        <button class="button bg-main icon-check-square-o" type="submit">
                            提交</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</body>
</html>