jsp客户端跳转实现登陆页面功能

任务要求:
使用客户端实现用户登录功能,创建登录页面,用户名密码正确跳转到主页面,并在主页面显示当前的用户名,错误跳转到失败页面,显示用户名密码错误,请重新登录,并链接到登陆页面。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>

<style>
		h3{
		text-align: center;
		}
		.user{
		color: #999;
		}
		form{
		text-align: center;
		}
		form .rem{
		margin-left: 30px;
		}
</style>

<body>

<%@ include file="_b5_登陆页面的实现_top.jsp"%><!-- 静态包含 -->
<%-- <jsp:include page="_b5_登陆页面_top.jsp"></jsp:include> --%> <!-- 这是动态包含,运行时的包含 -->
	<h3>欢迎进入清华大学用户登陆页面</h3>
	
<form type="text" action="_b5_登陆页面的实现_账户密码.jsp" method="post">

	<p> 用户名:<input type="text" name="username" value="请输入用户名" class="user"
	onfocus="if(this.value=='请输入用户名'){this.value='';this.style.color='#424242'} " 
    onblur="if(this.value==''){this.value='请输入用户名' ; this.style.color='#999'}"> 
    </p>
    
	<p>&nbsp;&nbsp;&nbsp;&nbsp;码:<input type="password" name="password"> </p>
	
	<input type="submit" value="登陆" class="rem">
	<input type="reset"  value="重置" class="rem"> 
	
</form>

<%@ include file="_b5_登陆页面的实现_bottom.jsp"%>

</body>

<script type="text/javascript">
		 
</script>

</html>

_b5_登陆页面的实现_top.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>Insert title here</title>
</head>
<body>
 <center>
    	<img src="image/baner.jpg" width=100%/>
    </center>
</body>
</html>

_b5_登陆页面的实现_账户密码.jsp:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

<%
	String username = request.getParameter("username");
	String password = request.getParameter("password");
	//request.setAttribute("name", username); //服务器端跳转时使用request
	session.setAttribute("name", username);//客户端跳转时使用session
	
	if(username.equals("111") && password.equals("123")){
		response.sendRedirect("_b5_denglu_success.jsp");//客户端跳转
		 
		%>
	<%-- 	<jsp:forward page=_b5_登陆页面的实现_账户密码成功.jsp""></jsp:forward>  <!-- 服务器端跳转 --> --%>
		<%   
		 
	}else{
		response.sendRedirect("_b5_denglu_fail.jsp");
	}
%>


</body>
</html>

注意:
request.setAttribute(“name”, username); //服务器端跳转时使用request
session.setAttribute(“name”, username);//客户端跳转时使用session



response.sendRedirect("_b5_denglu_success.jsp");//客户端跳转
%>
<jsp:forward page=_b5_登陆页面的实现_账户密码成功.jsp""></jsp:forward> < !-- 服务器端跳转 -->
<%

_b5_登陆页面的实现_bottom.jsp:

<%@ page contentType="text/html; charset=UTF-8" %>
<table width="100%" cellspacing="0" cellpadding="4" align="center" bordercolor="#A6CAF0" border=1>
    <tr> 
      <td> <div align="center"> 
          <p>清华大学软件系  <br>
             学校地址:北京市黄泉路1880号花拳绣腿<br/>
             电话:100010001
          </p>
    </div></td>
    </tr>
</table>


_b5_denglu_success.jsp:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

<%

	String name = (String)session.getAttribute("name");//object强制转换为string

%>
<h1>登陆成功</h1><br>
<h2>欢迎你
<%out.print(name); %>
</h2>

</body>
</html>

_b5_denglu_fail.jsp:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

<%
		out.print("很抱歉你输入的账户信息有误,请");
%>		
		<a href="_b5_登陆页面的实现_.jsp">重新输入</a>


</body>
</html>

登陆成功后的效果:
在这里插入图片描述
登陆失败后的效果:
在这里插入图片描述

  • 3
    点赞
  • 42
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

爱睡觉的小馨

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值