JSP实现登陆页面(表单提交、连接数据库、实现页面跳转)

JSP实现登陆页面(表单提交、连接数据库、实现页面跳转)

1.数据库设计

在这里插入图片描述

2.主页面展示

在这里插入图片描述

3.代码展示:

index.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>登陆页面</title><link rel="stylesheet" type="text/css" href="css/style.css" /><link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
</head>
<body><div id="bigBox"><h1>LOGIN</h1><div class="inputBox"><form action="check.jsp" method="post"><div class="inputText"><i class="fa fa-user-circle" style="color: whitesmoke;"></i><input type="text" placeholder="手机号或邮箱" name="username"/></div><div class="inputText"><i class="fa fa-key" style="color: whitesmoke;"></i><input type="password" placeholder="密码" name="password"/></div><input type="submit" class="inputButton" value="LOGIN" /></form></div></div>
</body>
</html>

登录页面对应的CSS文件

body{margin: 0;padding: 0;background-image: url(../img/国漫.jpg);background-repeat: no-repeat;
}
a{color: #666;text-decoration: none;
}
#bigBox
{margin: 0 auto;margin-top: 100px;padding: 20px 50px;background-color: #000000;width: 500px;height: 400px;border-radius: 20px;text-align: center;background-image: linear-gradient(60deg, #29323c 0%, #485563 100%);
}
#bigBox h1
{font-size: 40px;color: floralwhite;
}
#bigBox .inputBox
{margin-top: 35px;
}
#bigBox .inputBox .inputText
{margin-top: 20px;
}
#bigBox .inputBox .inputText input
{border: 0;padding: 10px 10px;border-bottom: 1px solid white;background-color: #00000000;color: white;width: 200px;height: 40px;font-size: 20px;
}
#bigBox .inputBox .inputText i
{color: white;
}
#bigBox .inputBox .inputButton
{border: 0;width: 200px;height: 50px;color: white;margin-top: 55px;border-radius:20px;background-image: linear-gradient(to right, #b8cbb8 0%, #b8cbb8 0%,#b465da 0%, #cf6cc9 33%, #ee609c 66%, #ee609c 100%);
}

check.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<%@ page import="java.sql.*"  %>
<!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("username");String password = request.getParameter("password");Connection connection = null;Statement statement = null;ResultSet rs = null;try {// 导入驱动,加载具体的驱动类Class.forName("com.mysql.jdbc.Driver");//与数据库建立连接connection = DriverManager.getConnection("jdbc:mysql://localhost:3306/test01", "root", "root");statement = connection.createStatement();//发送sql语句,执行String sql = "select count(*) from login where username = '"+username+"' and password = '"+password+"'  ";rs = statement.executeQuery(sql);//处理结果int count = -1;if (rs.next()) {count = rs.getInt(1);}if (count > 0) {request.getRequestDispatcher("success.jsp").forward(request, response);}else {request.getRequestDispatcher("error.jsp").forward(request, response);}} catch (ClassNotFoundException e) {e.printStackTrace();} catch (SQLException e) {e.printStackTrace();}finally {try {if(rs != null) rs.close();if(statement != null) statement.close();if(connection != null) connection.close();} catch (SQLException e) {e.printStackTrace();}}%>
</body>
</html>

success.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>登陆成功</title><link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css"><link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body><div id="main"><i class="fa fa-diamond fa-5x" style="color: #ed9db2; size: 50;"></i><h3 style="display: inline-block; ">登陆成功!!</h3></div>
</body>
</html>

在这里插入图片描述

error.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>登陆失败</title><link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css"><link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body><div id="main"><i class="fa fa-exclamation-triangle fa-5x" style="color: darkgrey; size: 50;"></i><h3 style="display: inline-block; ">登陆失败,请重新检查用户名或密码是否正确!!</h3></div>
</body>
</html>

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/485204.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

任正非在“GTS云与终端云合作与融合进展”汇报会上的讲话

任正非内部讲话音频版作者&#xff1a;任正非来源&#xff1a;蓝血研究&#xff08;lanxueyanjiu)2021年1月12日&#xff0c;任正非在“GTS云与终端云合作与融合进展”汇报会上发表讲话。任正非要求&#xff0c;要围绕着体验把端、管、云拉通&#xff0c;优化华为的GTS服务网络…

Hinton一作新论文:如何在神经网络中表示“部分-整体层次结构”?

来源 | AI科技评论作者 | Geoffrey Hinton编译 | 陈彩娴AI科技评论在 Twitter 上发现了一篇Hinton的新论文&#xff0c;作者只有Hinton本人&#xff0c;这篇论文没有介绍具体的算法&#xff0c;而是描绘了一个关于表示的宏观构想&#xff1a;如何在神经网络中表示部分-整体层次…

概率校准与Brier分数

1.再提逻辑回归 前面已经讲过了逻辑回归&#xff0c;这里不再细讲&#xff0c;只是简单的说一个函数&#xff0c;主要是方便大家更好的理解概率校准。 在逻辑回归中&#xff0c;用的最多的就是sigmod函数&#xff0c;这个函数的作用就是把无限大或者无限小的数据压缩到[0,1]之间…

费曼:所有科学知识都是不确定的

来源 &#xff1a; 网络作为科学家&#xff0c;我们知道伟大的进展都源于承认无知&#xff0c;源于思想的自由。那么这是我们的责任——宣扬思想自由的价值&#xff0c;教育人们不要惧怕质疑而应该欢迎它、讨论它&#xff0c;而且毫不妥协地坚持拥有这种自由——这是我们对未来…

遍历性能

iOS开发中数组常用的五种遍历方式 随着iOS的不断发展&#xff0c;apple也不断推出性能更高的数组遍历方式&#xff0c;下面将对熟悉的五种遍历方式进行列举。 首先定义一个数组&#xff0c;并获取数组长度 一、for循环 二、forin 快速枚举 三、NSEnumerator 四、快速遍历 五、快…

【剑指offer】面试题68 - I:二叉树的最近公共祖先(Java)

给定一个二叉搜索树, 找到该树中两个指定节点的最近公共祖先。 百度百科中最近公共祖先的定义为&#xff1a;“对于有根树 T 的两个结点 p、q&#xff0c;最近公共祖先表示为一个结点 x&#xff0c;满足 x 是 p、q 的祖先且 x 的深度尽可能大&#xff08;一个节点也可以是它自…

工业传感器:工业互联网的第一道门

来源&#xff1a;北京物联网智能技术应用协会作者&#xff1a;刘沁沈阳仪表科学研究院副总工程师、传感器国家工程研究中心常务副主任工业的发展离不开众多感知技术的加持&#xff0c;其中最为关键的技术之一便是传感器。可以说&#xff0c;工业传感器让自动化智能设备有了感知…

数学:二项式定理

先贴一张网图来弥补一下知识点&#xff0c;回顾NOIP2011计算系数 既然我们要求的是展开式中某一项的系数&#xff0c;那么就直接求出其对应的组合数就好了&#xff0c;但是要注意x和y都是有系数a和b的 x,y换成ax,by&#xff0c;得到x^ny^m的系数是a^n*b^m*C(k,n) 这样就可以了 …

城市大脑全球标准研究2:如何理解和定义城市大脑?

作者&#xff1a;刘锋城市大脑作为一个新生事物&#xff0c;如何理解和定义反映了人们对这个新事物的理解程度&#xff0c;同时由于城市大脑是一个复杂的智能巨系统&#xff0c;如何理解和定义它对于后续的建设和发展也将产生重大和深远的影响。目前对城市大脑的定义有如下几种…

Bengio、Hinton的不懈追求——深度学习算法揭示大脑如何学习

来源&#xff1a;AI科技评论编译&#xff1a;Don校对&#xff1a;青暮“如果我们能够揭示大脑的某些学习机制或学习方法&#xff0c;那么人工智能将能迎来进一步的发展&#xff0c;”Bengio如是说。深度学习依赖于精妙设计的算法&#xff0c;一行行精妙绝伦的公式让冰冷的计算机…

linux下的idea的界面问题,错位以及各种...

问题 ’ 方法 主题设置为GTK,多余的点会消失,而且字体也会好很多 转载于:https://www.cnblogs.com/ydymz/p/9595229.html

我们死去后,宇宙还能记住我们吗?

图片来源&#xff1a;Pixabay撰文&#xff1a;约翰霍根&#xff08;John Horgan&#xff09;翻译&#xff1a;常灏杰审校&#xff1a;曾小欢 吴非一些物理学家坚信信息不会消失&#xff0c;甚至在黑洞中也不会消失&#xff0c;但是这一“规律”也许只是一厢情愿而已。我是个强迫…

DataPipeline | PayPal庞姬桦:大数据在小微企业贷款上的运用

庞姬桦女士毕业于北京大学和美国哥伦比亚大学&#xff0c;目前担任PayPal公司消费者风险管理总监&#xff0c;负责通过大数据实现对互联网金融风险的侦测、跟踪、管控和防范。在加入PayPal之前&#xff0c;曾任职于渣打银行&#xff08;中国&#xff09;和美国运通公司&#xf…

贝尔实验室发布6G通信白皮书

来源&#xff1a;5G重要信息随着5G的广泛部署和落地无线通信网络演进的风向标转向6G合理地预测和构建下一代无线网络的全景是准确把握和引导6G研究方向的前提2021 MWCS期间贝尔实验室发布了《6G通信白皮书》分析生活和工作中&#xff0c;未来的通信演进方向探讨移动通信的变革大…

跌宕七十年,日本制造业兴衰「启示录」

作者&#xff1a; 凡夫俗子来源&#xff1a;凡夫俗子财经带着这样的问题&#xff0c;本文将对日本制造业的兴衰历程做一个详细的回顾与反思。在眼下的特殊时期&#xff0c;相信这个与中国一水相隔的国家所经历的种种&#xff0c;会给我们带来很好的启示。一、日本制造是一部技术…

Redis高可用详解:持久化技术及方案选择

文章摘自&#xff1a;https://www.cnblogs.com/kismetv/p/9137897.html 前言 在上一篇文章中&#xff0c;介绍了Redis的内存模型&#xff0c;从这篇文章开始&#xff0c;将依次介绍Redis高可用相关的知识——持久化、复制(及读写分离)、哨兵、以及集群。 本文将先说明上述几种技…

联合国首席AI顾问专访:我们期望AI应该是完美的,但这永远不会

大数据文摘出品来源&#xff1a;informationweek编译&#xff1a;张大笔茹联合国首席人工智能顾问Neil Sahota分享其对联合国重大AI项目以及当今AI面临的主要挑战的看法。人工智能在各个行业和政府中广泛使用的例子一度存在于科幻小说中。但如今&#xff0c;我们不必担心像许多…

特约专栏丨王耀南院士:人工智能赋能无人系统

来源&#xff1a;中国人工智能学会1 机器智能与智能机器让机器具备人一样的智能&#xff0c;赋予机器思考和推理的能力&#xff0c;是人类最伟大的梦想之一。早在 1948 年&#xff0c;图灵在题为《智能机器》的论文里&#xff0c;第一次为世人勾勒出了人工智能领域的轮廓。随后…

整个宇宙可能是个巨大的神经网络?看科学家们是这样解释的

来源&#xff1a;The Next Web作者&#xff1a;Tristan Greene编译&#xff1a;科技行者核心思想可以简单总结为&#xff1a;整个神经网络内的每种可观察的现象&#xff0c;都可以通过神经网络进行建模。从这个角度来看&#xff0c;宇宙自身在广义上也可能是个硕大无朋的神经网…

Nature封面!我国仿生软体机器人“打卡”地球最深海沟,遨游水下10900米!

来源&#xff1a;之江实验室、仿生深海软体机器人项目组、浙江大学▍适应万米静水压的软体机器人由于极端的静水压力&#xff0c;深海区域人们基本很难探测。位于西太平洋的马里亚纳海沟是已知的海洋最深处&#xff0c;水压高、温度低、完全黑暗&#xff0c;被称为“地球第四极…