• jsp登录界面设计


    实现结果:在login.jsp页面提交用户名和密码(可以验证是否为空),点击登录跳转到loginResult.jsp页面进行验证并显示结果

    JSP + JDBC + MySQL

    login.jsp

    设计一个表单,内容为两个输入框,一个用来输入用户名,另一个用来输入密码,并有一个提交按钮

    用JavaScript函数验证输入框是否都不为空

    代码为:

     1 <%@ page language="java" contentType="text/html; charset=UTF-8"
     2     pageEncoding="UTF-8"%>
     3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
     4 <html>
     5 <head>
     6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
     7 <script type="text/javascript">
     8     function $(id) {
     9         return document.getElementById(id);
    10     }
    11     
    12     function check() {
    13         var user = $("user").value;
    14         var pwd = $("pwd").value;
    15         
    16         $("userInfo").innerHTML="";
    17         $("pwdInfo").innerHTML="";
    18         
    19         if(user == "") {
    20             $("userInfo").innerHTML="用户名不能为空!";
    21             $("user").focus();
    22             return false;
    23         }
    24         
    25         if(pwd == "") {
    26             $("pwdInfo").innerHTML="密码不能为空!";
    27             $("pwd").focus();
    28             return false;
    29         }
    30         
    31         return true;
    32     }
    33 </script>
    34 
    35 <style type="text/css">
    36     #userInfo{color:red;}
    37     #pwdInfo{color:red;}
    38 </style>
    39 
    40 <title>登录</title>
    41 
    42 </head>
    43 
    44 <body>
    45     <center>
    46         <form action="loginResult.jsp" method="post" onsubmit="return check()">
    47             <br><br><br><br><br><br>
    48             <table>
    49                 <tr><td>用户名:</td><td><input type="text" name="userName" id="user"><span id="userInfo" ></span></td></tr>
    50                 <tr><td>密码:</td><td><input type="password" name="userPwd" id="pwd"><span id="pwdInfo"></span></td></tr>
    51                 <tr><td></td><td><input type="submit" value="登     录"></td>
    52                 
    53             </table>
    54         </form>
    55     </center>
    56 </body>
    57 
    58 </html>

    loginResult.jsp页面

    1、利用JSP内置对象获取用户名和密码

    1       String user = request.getParameter("userName");
    2         String password = request.getParameter("userPwd");

    2、注册驱动MySQL的驱动程序

    Class.forName(“com.mysql.jdbc.Driver”);

    3、构建连接符号字

    String url1 = "jdbc:mysql://localhost:3306/" + 数据库名;
    String url2 = "?user=" + 数据库用户名 + "&password=" + 数据库密码;
    String url3 = "&useUnicode=true&characterEncoding=UTF-8";
    String url = url1 + url2 + url3;

    4、构建数据库连接对象

    Connection conn = DriverManager.getConnection(url);

    5、构建SQL语句,创建数据库操作对象

    String sql = "select * from loginInfo where username=?";
            pstmt = conn.prepareStatement(sql);
    pstmt.setString(1,username);//设置值

    6、执行查询,得到查询结果集

    ResultSet rs = pstmt.executeQuery();

    7、结果处理

    如果rs.next()为true,则说明该用户名存在,继续验证密码是否正确;否则该用户名不存在

    if(rs.next()) {
                if(rs.getString("password").equals(password)) {
                    %><center><h1>用户 <%=rs.getString("userName")%>登陆成功!</h1></center><%
                    
                }
                else {
                    %><center><h1>密码错误!</h1></center><%
                }
            }    
            else {
                %><center><h1>用户名不存在!</h1></center>
            <%}

    8、释放资源

          if(rs != null) {
                rs.close();
            }
            if(pstmt != null) {
                pstmt.close();
            }
            if(conn != null) {
                conn.close();
            }
  • 相关阅读:
    gulp和webpack的区别和联系
    Cesium-CesiumWidget, Viewer, Scene三者之间的关系
    node-gpy
    Cesium与Threejs结合
    【每日一具1】Morin 魔音一款支持手机、电脑的音乐软件,全网歌曲免费听/下载
    Python网络爬虫(实践篇)
    Python网络爬虫(浏览器伪装技术)
    Python网络爬虫(理论篇)
    【每日一具1】Morin 魔音一款支持手机、电脑的音乐软件,全网歌曲免费听/下载
    永久免费,搞定全网音乐!
  • 原文地址:https://www.cnblogs.com/liuxining/p/6457918.html
Copyright © 2020-2023  润新知