1.index

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>


<html>
<head>
<base href="<%=basePath%>">

<title></title>
<style type="text/css">
body {
    font-size: 13px;
    font-family: "宋体";
} /*全局控制*/
body,form,input,p {
    padding: 0;
    margin: 0;
    border: 0;
} /*重置浏览器的默认样式*/
form {
    width: 350px;
    height: 250px;s
    padding-top: 20px;
    margin: 50px auto; /*使表单在浏览器中居中*/
    background: #3aa7ea; /*为表单添加背景颜色*/
    border-radius: 20px; /*设置圆角边框*/
    border: 3px solid #4faccb;
}

p {
    margin-top: 15px;
    text-align: center;
}

p span {
    width: 40px;
    display: inline-block;
    text-align: right;
}

.num,.pass { /*对文本框设置共同的宽、高、边框、内边距*/
    width: 152px;
    height: 18px;
    border: 1px solid #38a1bf;
    padding: 2px 2px 2px 22px;
}

.num { /*定义第一个文本框的背景、文本颜色*/
    background: url(images/1.jpg) no-repeat 5px center #FFF;
    color: #999;
}

.pass { /*定义第二个文本框的背景*/
    background: url(images/2.jpag) no-repeat 5px center #FFF;
}

.btn01,.btn02 {
    width: 60px;
    height: 25px;
    border-radius: 3px; /*设置圆角边框*/
    border: 1px solid #6b5d50;
    margin-left: 30px;
}

.btn01 {
    background: #3aa7ea;
} /*设置第一个按钮的背景色*/
</style>
</head>

<body>
    <form action="dologin.jsp" method="post" autocomplete="on">
        <p>
            <span>账号:</span> <input type="text" name="user" class="num" />
        </p>
        <p>
            <span>密码:</span> <input type="password" name="password" class="pass" />
        </p>
        <p>
            <span>验证码</span><input type="text" name="code" />qwer
        </p>

        <p>
            <input type="submit" class="btn01" value="登录" />
        </p>

    </form>

</body>
</html>

2.数据处理

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ page import="java.sql.*"%>

<html>
<head>
<base href="<%=basePath%>">

<title>My JSP TWO</title>

</head>

<body>

    <%
        String Name = request.getParameter("user"); //获取输入的用户名
        String ps = request.getParameter("password"); // 密码
        String code = request.getParameter("code"); //验证码
        Name.trim(); //去空格
        ps.trim();

        PreparedStatement pre = null;
        Connection con = null;
        Statement sql;
        ResultSet rs;
        request.setCharacterEncoding("utf-8");

        try {
            Class.forName("com.mysql.jdbc.Driver");
        } catch (Exception e) {
            out.print("<h1>加载错误" + e);
        }

        String user = "root";
        String password = "root";

        con = DriverManager.getConnection(
                "jdbc:mysql://127.0.0.1:3306/test", user, password);

        try {
            sql = con.createStatement();

            String SQLL = "select * from user where uname=? and upwd=?";
            pre = con.prepareStatement(SQLL);
            pre.setString(1, Name);
            pre.setString(2, ps);

            rs = pre.executeQuery();

            if (rs.next()) {
                String na = rs.getString(2);
                session.setAttribute("uname", na);
                response.sendRedirect("welcome.jsp");

            } else {
    %>
    <script>
        //弹窗提示
        alert('输入密码或用户名错误');
    </script>
    <%
        response.sendRedirect("index.jsp");
            }
        } catch (SQLException e) {
            out.print("<h1>查询错误" + e);
        }
    %>
    
</body>
</html>

3.登录

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<html>
  <head>
    <base href="<%=basePath%>">
      
    <title>My JSP 3</title>
  
  </head>
    
  <body>
    欢迎<%=session.getAttribute("uname") %></body>
</html>