完整的可以与数据库连接的登录界面的代码

login.jsp

                                                                                #diceng{                    width:430px;                    height:380px;                    background-color:#FFFFFF33;                    position:absolute;                    left:50%;                    top:50%;                    margin-left:-215px;                    margin-top:-190px;                    border-radius:5px;                }                #zhongceng{                    width:400px;                    height:350px;                    background-color:#FFFFFFFF;                    position:absolute;                    left:50%;                    top:50%;                    margin-left:-200px;                    margin-top:-175px;                    border-radius:5px;                }                #d1{                    width:400px;                    height:60px;                    font-size:30px;                    font-family:Avenir,Helvetica,Arial,sans-serif;                    color:black;                    display:block;                    margin-left:40px;                    margin-top:20px;                                    }                #d2{                    width:400px;                    height:35px;                    font-size:20px;                    font-family:Avenir,Helvetica,Arial,sans-serif;                    color:black;                    display:block;                    margin-left:40px;                                    }                #d3{                    width:400px;                    height:35px;                    font-size:20px;                    font-family:Avenir,Helvetica,Arial,sans-serif;                    color:black;                    display:block;                    margin-left:40px;                                    }                #username{                    width:280px;                    height:40px;                    font-size:30px;                    font-family:Avenir,Helvetica,Arial,sans-serif;                    color:black;                    display:block;                    margin-left:40px;                    border-radius:5px;                                    }                #password{                    width:280px;                    height:40px;                    font-size:30px;                    font-family:Avenir,Helvetica,Arial,sans-serif;                    color:black;                    display:block;                    margin-left:40px;                    border-radius:5px;                                                        }                #submit{                    width:237px;                    height:40px;                    margin-top: 5px;                    background-color: #47a0fc;                    border: 1px solid #47a0fc;                    color: #fff;                    font-size: 14px;                    cursor: pointer;                    outline: none;                    border-radius: 2px;                    display:block;                    margin-left:65px;                    margin-top:15px;                    border-radius:5px;                                    }                .bjimg {                    position: fixed;                    top: 0;                    left: 0;                    width: 100%;                    height: 100%;                    min-width: 1000px;                    z-index: -10;                    zoom: 1;                    background-color: #fff;                    background-repeat: no-repeat;                    background-size: cover;                    -webkit-background-size: cover;                    -o-background-size: cover;                    background-position: center 0;                    background-image:url("https://w.wallhaven.cc/full/ex/wallhaven-ex9ork.jpg")                    }                                
        
            
                                
欢迎登录优逸客实训平台                    
用户名                                        
密码                                        登录                                $(document).ready(function(){        $("#submit").click(function(){            var username = $("#username").val(); // 获取用户名            var password = $("#password").val(); // 获取密码            if(username == "" || password == ""){                alert("请输入用户名和密码！"); // 输入为空，提示用户                return;            }            $.ajax({                url: "jdbclogin.jsp?username="+username+"&password="+password, // 后端处理jsp文件                type: "GET",                dataType:'json',                success: function(res){                    if(res.msg== "success"){                        window.location.href = "main.jsp"; // 登录成功，跳转到主页                    }else{                        alert("用户名或密码错误！"); // 登录失败，提示用户                    }                }            });        });    });    

jdbclogin.jsp

register.jsp

#diceng{width:430px;height:380px;background-color:#FFFFFF33;position:absolute;left:50%;top:50%;margin-left:-215px;margin-top:-190px;border-radius:5px;}#zhongceng{width:400px;height:350px;background-color:#FFFFFFFF;position:absolute;left:50%;top:50%;margin-left:-200px;margin-top:-175px;border-radius:5px;}#d1{width:400px;height:40px;font-size:30px;font-family:Avenir,Helvetica,Arial,sans-serif;color:black;display:block;margin-left:40px;margin-top:20px;}#d2{width:400px;height:35px;font-size:20px;font-family:Avenir,Helvetica,Arial,sans-serif;color:black;display:block;margin-left:40px;}#d3{width:400px;height:35px;font-size:20px;font-family:Avenir,Helvetica,Arial,sans-serif;color:black;display:block;margin-left:40px;}#d7{width:400px;height:35px;font-size:20px;font-family:Avenir,Helvetica,Arial,sans-serif;color:black;display:block;margin-left:40px;}#username{width:280px;height:30px;font-size:30px;font-family:Avenir,Helvetica,Arial,sans-serif;color:black;display:block;margin-left:40px;border-radius:5px;}#password1{width:280px;height:30px;font-size:30px;font-family:Avenir,Helvetica,Arial,sans-serif;color:black;display:block;margin-left:40px;border-radius:5px;}#password2{width:280px;height:30px;font-size:30px;font-family:Avenir,Helvetica,Arial,sans-serif;color:black;display:block;margin-left:40px;border-radius:5px;}#submit{width:237px;height:40px;    margin-top: 5px;    background-color: #47a0fc;    border: 1px solid #47a0fc;    color: #fff;    font-size: 20px;    cursor: pointer;    outline: none;    border-radius: 2px;display:block;margin-left:65px;margin-top:15px;border-radius:5px;}.bjimg {    position: fixed;    top: 0;    left: 0;    width: 100%;    height: 100%;    min-width: 1000px;    z-index: -10;    zoom: 1;    background-color: #fff;    background-repeat: no-repeat;    background-size: cover;    -webkit-background-size: cover;    -o-background-size: cover;    background-position: center 0;background-image:url("https://w.wallhaven.cc/full/ex/wallhaven-ex9ork.jpg")}
欢迎注册优逸客实训平台
用户名
密码
再次输入密码注册    function register(){    var username = $("#username")[0].value;    var password1 = $("#password1")[0].value;    var password2 = $("#password2")[0].value;            $.ajax({                url: "jdbcregister.jsp?username="+username+"&password1="+password1+"&password2="+password2,                type: "GET",                dataType:"json",                success: function(res){                                    if(res.msg == "success"){                        window.location.href = "login.jsp";                    }else{                        alert("注册失败！");                    }                }            })    }

jdbcregister.jsp

 0){               writer.write("{\"msg\":\"success\"}");               writer.flush();             }else{               writer.write("{\"msg\":\"fail\"}");               writer.flush();             }            }    }        else{           writer.write("{\"msg\":\"fail\"}");           writer.flush();            }             %>

main.jsp

body {background-image: url("https://w.wallhaven.cc/full/j3/wallhaven-j3m8y5.png");background-size: cover;background-position: center center;font-family: 'Microsoft YaHei', sans-serif;color: white;}#header {background-color: rgba(0, 0, 0, 0.5);padding: 20px;display: flex;align-items: center;justify-content: space-between;}#header img {height: 80px;border-radius: 50%;margin-right: 20px;}h1 {font-size: 48px;margin: 0;font-weight: bold;font-style: italic;text-shadow: 2px 2px 4px #000000;}nav {background-color: rgba(0, 0, 0, 0.5);padding: 10px;display: flex;justify-content: center;}nav a {color: white;text-decoration: none;margin: 0 10px;font-size: 24px;font-weight: bold;text-transform: uppercase;letter-spacing: 2px;transition: all 0.3s ease;}nav a:hover {color: #00ff00;}
登陆成功！

5.16笔记一、JDBC回顾

JDBC技术Java用来连接操作数据库的工具，JDBC严格意义上属于Java的一种技术。JDBC连接操作数据库时，整体一共分为七步（需要引入编程依赖）。

1、加载驱动（告诉JDBC程序，连接的是哪一个数据库）

Class.forName(“驱动程序名”);
MySQL: com.mysql.jdbc.Driver com.mysql.cj.jdbc.Driver
Oracle: oracle.jdbc.driver.OracleDriver
SQL Server: com.microsoft.jdbc.sqlserver.SQLServerDriver

2、获取和数据库之间的连接—java.sql.DriverManager

Connection conn = DriverManager.getConnection(三个参数);
三个参数也成为数据库连接三要素：
① URL：数据库的地址、连接的数据库的名字、连接数据库使用的参数
MySQL： jdbc:mysql://ip:port/databaseName?key=value&key=value
Oracle: jdbc:oracle:thin:@IP地址:端口号:数据库名
SQL Server: jdbc:microsoft:sqlserver://IP地址:端口号;DatabaseName=数据库名
② 用户名： 数据库的用户名
③ 密码：数据库的密码

3、准备SQL语句

String sql = “xxxxx”;
JDBC操作数据库时，一般执行的SQL语句都是DML和DQL类型的语言。
SQL语句中存在一些字符串，字符串最好使用单引号。

4、创建小推车—java.sql.Statement

Statement stat = conn.createStatement();
小推车是JDBC的核心，SQL语句的执行以及执行结果的返回都是Statement实现的

5、小推车带着SQL语句去数据库执行SQL语句，并且返回执行结果

JDBC操作SQL，SQL一般分为两类：DML、DQL，两类SQL语句的执行方式以及返回结果都是不同的。
执行DML类型的SQL：–返回的是一个数字，这个数字代表数据库受影响的行数
int num = stat.executeUpdate(DMLSQL);
执行DQL类型SQL—返回的是一个ResultSet结果集，结果集就是查询回来的虚拟表格，
ResultSet rs = stat.executeQuery(DQLSQL);

6、Java程序处理逻辑

如果执行的是DML类型的SQL语句，Java程序只需要判断是否执行成功即可
如果执行的是DQL类型的SQL语句，Java程序需要获取ResultSet结果集当中封装的虚拟表格数据。

7、释放JDBC程序使用的资源

ResultSet Statement Connection
如果执行的是DML类型的SQL，只需要释放两个Statement Connection
如果执行的是DQL类型的SQL，需要释放这三个

释放顺序：先创建的后释放、后创建的先释放
释放调用这三者的close()方法即可。

本文来自博客园，作者：qi_fen_zhong，转载请注明原文链接：https://www.cnblogs.com/ningbaby/p/17411003.html