【JAVA EE#5】【传智书城·源码阅读】购物车模块：购书流程+分页显示+自定义jsp标签进行安全检查+js倒计时简单实现

本文链接：https://blog.csdn.net/Jelly_Bean/article/details/106965267

本文介绍了Java Web项目中购物车模块的购书流程，包括页面布局、分页显示的实现。使用EL表达式和forEach遍历显示商品信息，分页逻辑通过PageBean实现。此外，还讲解了自定义jsp标签进行安全检查，并展示了js实现的简单倒计时功能。整个购物流程严谨，分页功能设计巧妙。

摘要由CSDN通过智能技术生成

购书流程
本模块业务逻辑：
在这里插入图片描述
jsp文件分析
product_list.jsp是点击分类默认显示的布局，而product_search_list.jsp是搜索结果页面布局，是内容主要是以下红线框住部分，特点：分类条件显示（只有product_list.jsp是，product_search_list.jsp该处统一“全部商品”）、动态显示对应分类或者查询图书结果条数、动态显示书名售价及封面、分页显示的实现。

product_list.jsp页面显示：
在这里插入图片描述
product_search_list.jsp页面显示：

因为分类和搜索后都会返回一个PageBean到request储存着，所以分类条件显示、动态显示对应分类或者查询图书结果条数这两个功能用EL表达式直接就可以实现。

<h1>商品目录</h1>
	<hr />
		<h1>${
   bean.category}</h1>&nbsp;&nbsp;&nbsp;&nbsp;共${
   bean.totalCount}种商品
	<hr />

动态显示书名售价及封面，主要用了c标签forEach语句遍历输出在Pagebean中product list列表，关于PageBean的数据结构，如何做到结果分页显示的，有待探讨。

分页显示

<c:forEach items="${bean.ps}" var="p" varStatus="vs">
	<td>
		<div class="divbookpic">
			<p>
				<a href="${pageContext.request.contextPath}/findProductById?id=${p.id}">
				<img src="${pageContext.request.contextPath}${p.imgurl}" width="115" height="129" border="0" /> </a>									
			</p>
		</div>
		<div class="divlisttitle">
			<a href="${pageContext.request.contextPath}/findProductById?id=${p.id}">书名： ${
   p.name}<br />售价：￥${
   p.price} </a>
		</div>
	</td>
</c:forEach>

分页显示的实现：

<div class="pagination">
	<ul>
	<!-- 上一页按钮 -->
		<c:if test="${bean.currentPage!=1}">
		<li class="disablepage_p">
		<a class="disablepage_a" href="${pageContext.request.contextPath}/showProductByPage?currentPage=${bean.currentPage-1}&category=${bean.category}"></a>
		</li>
		</c:if>
	<!-- 中间按钮 -->
		<c:if test="${bean.currentPage==1}">
		<li class="disablepage_p2"></li>
		</c:if>
		
		<c:forEach begin="1" end="${bean.totalPage}" var="pageNum">
		<c:if test="${pageNum==bean.currentPage}">
		<li class="currentpage">${
   pageNum }</li>
		</c:if>
		
		<c:if test="${pageNum!=bean.currentPage}">
		<li><a href="${pageContext.request.contextPath}/showProductByPage?currentPage=${pageNum}&category=${bean.category}">${
   pageNum}</a></li>
		</c:if>
		/c:forEach>

		<c:if test="${bean.currentPage==bean.totalPage||bean.totalPage==0}">
		<li class="disablepage_n2"></li>
		</c:if>
	
	<!-- 下一页按钮 -->
		<c:if test="${bean.currentPage!=bean.totalPage&&bean.totalPage!=0}">
		<li class="disablepage_n">
		<a class="disablepage_a" href="${pageContext.request.contextPath}/showProductByPage?currentPage=${bean.currentPage+1}&category=${bean.category}"></a></li>
		</c:if>
	</ul>
</div>

main.css中，例：

.pagination li.disablepage_p {
   
	width: 75px;
	height: 15px;
	padding: 5px;
	color: #929292