JSP动作元素

1.<jsp:include>

2. <jsp:forward>

阶段案例书城JSP页面

JSP动作元素

1.<jsp:include>

在JSP页面中，为了把其他资源的输出内容插入到当前JSP页面的输出内容中，JSP技术提供了<jsp:include>动作元素，<jsp:include>动作元素的具体语法格式如下所示。

<jsp:include page="relativeURL" flush="true|false" />

2.<jsp:forward>

<jsp:forward>动作元素将当前请求转发到其他Web资源（HTML页面、JSP页面和Servlet等），在执行请求转发之后的当前页面将不再执行，而是执行该元素指定的目标页面。其具体语法格式如下所示。

<jsp:forward page="relativeURL" />

阶段案例书城JSP页面

实现步骤

1.首页设置

使用<jsp:forward>动作元素跳转到项目端展示首页

<body>
<jsp:forward page="client/index.jsp"><jsp:forward>
</body>

2.文件移植

将clienthtml文件改为jsp文件

使用page指令解决中文乱码

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding=
"UTF-8"%>

3.修改JSP页面的地址和链接

当点击“新用户注册”链接后，所访问的链接路径是/chapter06/register.jsp,而项目中注册页面的真实路径是/chapter06/client/register.jsp,所以出现了“404”错误。要解决此问题，只需在 index.jsp页面文件中的链接和图片等路径前，加入“${pageContext.request.contextPath}/client/”即可。

<a href="${pageContext.request.contextPath}/client/register.jsp">
新用户注册
</a>

注：为了避免项目中的JS、CSS和图片等文件也出现找不到文件的错误，所以需要将所有JSP 文件中的相关链接前都加入$/pageContext.request.context Path}/client/。

4.抽取页面代码

通常一个项目中的头部和底部代码是固定的，如果每一个页面都有这些代码，会使项目十分臃肿，不利于项目的开发和维护。此时，可以将项目中的重复代码抽取出到一个新的JSP页面，然后通过JSP的include指令来引入这些抽取出的JSP页面。

head.jsp

menu_search.jsp 菜单栏

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<div id="divmenu">
		<a href="#">文学</a> 
		<a href="#">生活</a> 
		<a href="#">计算机</a> 
		<a href="#">外语</a> 
		<a href="#">经管</a>
		<a href="#">励志</a> 
		<a href="#">社科</a> 
		<a href="#">学术</a> 
		<a href="#">少儿</a>
		<a href="#">艺术</a> 
		<a href="#">原版</a> 
		<a href="#">科技</a> 
		<a href="#">考试</a> 
		<a href="#">生活百科</a> 
		<a href="#" style="color:#FFFF00">全部商品目录</a>		
</div>
<div id="divsearch">
<form action="#" id="searchform">
	<table width="100%" border="0" cellspacing="0">
		<tr>
			<td style="text-align:right; padding-right:220px">
				Search 
				<input type="text" name="textfield" class="inputtable" id="textfield" value="请输入书名"
				onmouseover="this.focus();"
				onclick="my_click(this, 'textfield');"
				onBlur="my_blur(this, 'textfield');"/> 
				<a href="#">
					<img src="images/serchbutton.gif" border="0" style="margin-bottom:-4px" onclick="search()"/> 
				</a>
			</td>
		</tr>
	</table>
</form>
</div>

foot.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<div id="divfoot">
		<table width="100%" border="0" cellspacing="0" >
			<tr>
				<td rowspan="2" style="width:10%">
					<img src="images/logo.png" width="195" height="50"
					style="margin-left:175px" />
				</td>
				<td style="padding-top:5px; padding-left:50px">
					<a href="#">
						<font color="#747556"><b>CONTACT US</b></font> 
					</a>
				</td>
			</tr>
			<tr>
				<td style="padding-left:50px">
					<font color="#CCCCCC">
						<b>COPYRIGHT 2015 &copy; BookStore All Rights RESERVED.</b> 
					</font>
				</td>
			</tr>
		</table>
	</div>

使用include 指令将抽取出的3个JSP页面包含在 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" href="css/main.css" type="text/css" />
<!-- 导入首页轮播图css和js脚本 -->
<link type="text/css" href="css/autoplay.css" rel="stylesheet" />
<script type="text/javascript" src="js/autoplay.js"></script>

</head>
<body class="main">
	<!-- 1.网上书城顶部 start -->
	<%@include file="head.jsp" %>


	<!-- 网上书城顶部  end -->

	<!--2. 网上书城菜单列表  start -->
	<%@include file="search.jsp" %>

<!-- 网上书城菜单列表  end -->

<!-- 3.网上书城首页轮播图  start -->
	<div id="box_autoplay">
    	<div class="list">
        	<ul>
            	<li><img src="ad/index_ad1.jpg" width="900" height="335" /></li>
            	<li><img src="ad/index_ad2.jpg" width="900" height="335" /></li>
            	<li><img src="ad/index_ad3.jpg" width="900" height="335" /></li>
            	<li><img src="ad/index_ad4.jpg" width="900" height="335" /></li>
            	<li><img src="ad/index_ad5.jpg" width="900" height="335" /></li>
        	</ul>
    	</div>
	</div>
	<!-- 网上书城首页轮播图  end -->
	<!--4. 公告板和本周热卖  start -->
    <div id="divcontent">
		<table width="900px" border="0" cellspacing="0">
			<tr>
				<td width="497">
				
					<img src="images/billboard.gif" width="497" height="38" />
					<table cellspacing="0" class="ctl">
						<tr>
							<td width="485" height="29">
                            尊敬的网上书城用户， 　　<br />
　　为了让大家有更好的购物体验，3月25日起，当日达业务关小黑屋回炉升级！<br />具体开放时间请留意公告，感谢大家的支持与理解，祝大家购物愉快！<br />
        3月23日<br />
        传智播客 网上书城系统管理部<br />
                            </td>
						</tr>
					</table>
				</td>
				<td style="padding:5px 15px 10px 40px">
					<table width="100%" border="0" cellspacing="0">
						<tr>
							<td>
								<img src="images/hottitle.gif" width="126" height="29" />
							</td>
						</tr>
					</table>
					<table width="100%" border="0" cellspacing="0">
						<tr>						
							<td style="width:80; text-align:center">
								<a href="#">
								<img src="bookcover/105.jpg" width="102" height="130" border="0" />
								</a>
								<br /> 
							</td>		
							<td style="width:80; text-align:center">
								<a href="#">
								<img src="bookcover/106.jpg" width="102" height="130" border="0" />
								</a>
								<br /> 
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</div>
<!-- 公告板和本周热卖  end -->	

<!--5. 网上书城底部 start -->
<%@include file="foot.jsp" %>

	<!-- 网上书城底部  end -->
</body>
</html>

减少了页面的代码量，提高了代码的复用性

实现注册页面

1.修改注册页面，引用公共页面代码

<%@ 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="css/main.css" type="text/css" />
<!-- 导入首页轮播图css和js脚本 -->
<link type="text/css" href="css/autoplay.css" rel="stylesheet" />
<script type="text/javascript" src="js/autoplay.js"></script>

</head>
<body class="main">
	<!-- 1.网上书城顶部 start -->
	<%@include file="head.jsp" %>


	<!-- 网上书城顶部  end -->

	<!--2. 网上书城菜单列表  start -->
	<%@include file="search.jsp" %>

<!-- 网上书城菜单列表  end -->

<!-- 3.网上书城首页轮播图  start -->
	<div id="box_autoplay">
    	<div class="list">
        	<ul>
            	<li><img src="ad/index_ad1.jpg" width="900" height="335" /></li>
            	<li><img src="ad/index_ad2.jpg" width="900" height="335" /></li>
            	<li><img src="ad/index_ad3.jpg" width="900" height="335" /></li>
            	<li><img src="ad/index_ad4.jpg" width="900" height="335" /></li>
            	<li><img src="ad/index_ad5.jpg" width="900" height="335" /></li>
        	</ul>
    	</div>
	</div>
	<!-- 网上书城首页轮播图  end -->
	<!--4. 公告板和本周热卖  start -->
    <div id="divcontent">
		<table width="900px" border="0" cellspacing="0">
			<tr>
				<td width="497">
				
					<img src="images/billboard.gif" width="497" height="38" />
					<table cellspacing="0" class="ctl">
						<tr>
							<td width="485" height="29">
                            尊敬的网上书城用户， 　　<br />
　　为了让大家有更好的购物体验，3月25日起，当日达业务关小黑屋回炉升级！<br />具体开放时间请留意公告，感谢大家的支持与理解，祝大家购物愉快！<br />
        3月23日<br />
        传智播客 网上书城系统管理部<br />
                            </td>
						</tr>
					</table>
				</td>
				<td style="padding:5px 15px 10px 40px">
					<table width="100%" border="0" cellspacing="0">
						<tr>
							<td>
								<img src="images/hottitle.gif" width="126" height="29" />
							</td>
						</tr>
					</table>
					<table width="100%" border="0" cellspacing="0">
						<tr>						
							<td style="width:80; text-align:center">
								<a href="#">
								<img src="bookcover/105.jpg" width="102" height="130" border="0" />
								</a>
								<br /> 
							</td>		
							<td style="width:80; text-align:center">
								<a href="#">
								<img src="bookcover/106.jpg" width="102" height="130" border="0" />
								</a>
								<br /> 
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</div>
<!-- 公告板和本周热卖  end -->	

<!--5. 网上书城底部 start -->
<%@include file="foot.jsp" %>

	<!-- 网上书城底部  end -->
</body>
</html>

2.运行项目，查看效果

点击新用户注册链接进入注册页面

初识JavaBean

1.什么是JavaBean

javaBean是一种规范，也就是对类的要求，他要求类的成员变量提供getter/setter方法。这样的成员变量称为JavaBean属性。JavaBean还要求提供无参构造器。

/**
 * 简单的JavaBean 
 *
 */
public class Student {
	private String id;
	private String name;
	private String password;
	public String getId() {
		return id;
	}

	public void setId(String id) {
		this.id = id;
	}

	public String getName() {
		return name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public String getPassword() {
		return password;
	}

	public void setPassword(String password) {
		this.password = password;
	}

	public AdminVo(String id, String name, String password) {
		super();
		this.id = id;
		this.name = name;
		this.password = password;
	}
	
}

2.访问JavaBean属性

JavaBean是具有setter/getter方法的成员变量。只提供getter叫只读，只提供setter叫做只写。
jsp与JavaBean相关的标签动作。

<jsp:useBean>:创建JavaBean对象，以反射的机制实现
在当前页创建JavaBean对象，把创建的对象保存到域对象之中

<jsp:javaBean id="实例名" class="包.类名" scope="保存的四种范围">
默认保存到当前页page  可以设置为：page，request，session，application
javaBean不一定会创建对象，只有当对象不存在的时候才会创建！！

<jsp:useProperty>:设置JavaBean的属性
<jsp:getProprety>:获取JavaBean的属性

jsp:useBean id="user" class="" scope="">
		<jsp:setProperty property="username" name="user" value=“admin”/>设置JavaBean中username的值
</jsp:useBean>
<jsp:useBean id="user" class="" scope="">
		<jsp:getProperty property="username" name="user"/>获取JavaBean中username的值
</jsp:useBean>

例

创建Person 类，Person类中定义了name和age两个属性，并提供了对应的getter方法和setter法供外界访问这两个属性

创建BeanUtilDemo类

JaveWeb-08jsp动作元素及JavaBean

JSP动作元素

1.<jsp:include>

2.<jsp:forward>

阶段案例书城JSP页面

实现步骤

1.首页设置

2.文件移植

3.修改JSP页面的地址和链接

4.抽取页面代码

实现注册页面

1.修改注册页面，引用公共页面代码

2.运行项目，查看效果

初识JavaBean

1.什么是JavaBean

2.访问JavaBean属性

Guess you like

JaveWeb-08jsp动作元素及JavaBean

JSP动作元素

1.<jsp:include>

2.<jsp:forward>

阶段案例 书城JSP页面

实现步骤

1.首页设置

2.文件移植

3.修改JSP页面的地址和链接

4.抽取页面代码

实现注册页面

1.修改注册页面，引用公共页面代码

2.运行项目，查看效果

初识JavaBean

1.什么是JavaBean

2.访问JavaBean属性

Guess you like

阶段案例书城JSP页面