点击商品进入详情页面

2023-11-01

需求:点击商品,进入对应商品的详情页面

实现:获取商品的Id运用<a>标签使用Url参数,将商品Id发送到Servlet。

看url地址就知道发送请求时将商品id发送出去了

Html代码

<c:forEach var="item" items="${list}">
		<div class="window">
			<div class="imageContainer">
				<span class="imgLink">
				<a target="_blank"  href="${ctx }/ProductDetailsServlet?id=${item.id }" ><img src="${item.imgUrl}"/></a>			
				</span>
			</div>
		</div>
	</c:forEach>

Servlet代码

        //获取Session对象
		HttpSession session = request.getSession();
		//service进行逻辑处理
		ProductService service=new ProductService();
		//获取url中的参数
		String	productlId= request.getParameter("id");
		//将String转为int
		int id=Integer.parseInt(productlId);
		//通过商品Id获取商品信息
		Product product=service.getUserIdList(id);
		//将商品信息存放到Request域中
		request.setAttribute("product", product);
		//跳转到商品的详情页面
		request.getRequestDispatcher("/test/detail.jsp").forward(request, response);

Service层

    /*
	 * 根据商品Id查询商品
	 */
		public Product getUserIdList(int id) {
			//返回结果
				Product result = null;
					//返回结果
					if(id>0) {
					result=this.dao.getProductID(id);
					}
					return result;
}

Dao层

    /*
	 * 通过商品Id查询商品
	 */
	public Product getProductID(Integer id){
	    Product list=null;
		String sql="select * from product where id=?";
		try {
			list=(Product) runner.query(sql, new BeanHandler(Product.class),id);
		} catch (SQLException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		return list;
	}

最后到商品详情页面接收信息

<div class="bigbox">
<div id="img-tb">
	<img src="${product.imgUrl }"/>
	<div id="slider"></div>
</div>
<div id="img-big">
	<img src="${product.imgUrl }"/>
</div>
<div class="detail">
  <h1>${product.desc }</h1>
  <p class="newp">双12返场 专区2件9折,3件8.5折 全场包邮</p>
</div>
<div class="panel">
	<div class="pl">价格</div>
	<em class="my">¥</em>
	<span class="price">${product.price}</span>
</div>

<div class="yunfei">
	<dl class="all">
	<dt class="yf">运费</dt>
<div class="message">
	<span class="location">浙江温州 至 阳江</span>
</div>
<div class="text">店铺预售,付款后7天内发货</div>
</dl></div>

<div class="last">
<div class="one">
	<dt class="chima">尺码</dt>
	<dd>
		<ul>
        <li><a href="#" role="button" tabindex="0">
        	<span>S/165</span>
            </a></li>
        <li><a href="#" role="button" tabindex="0">
        	<span>M/170</span>
            </a></li>
        <li><a href="#" role="button" tabindex="0">
        	<span>L/175</span>
            </a></li>
        <li><a href="#" role="button" tabindex="0">
        	<span>XL/180</span>
            </a></li>
        </ul>
    </dd>
</div>
</div> 

<div class="amount">
	<dt class="shuliang"><p style=" font-size:18px;">数量</p></dt>
	<%@include file="../test/test.jsp" %>
	<input id="productId" name="productId" value="${product.id }" type="hidden">

</div> 
<div class="shop">
<div class="l">
	<a id="J_LinkBuy" href="#" rel="nofollow" data-addfastbuy="true" title="点击此按钮,到下一步确认购买信息。" role="button" onclick="goumai();">立即购买<span class="ensureText">确认</span></a>
</div>
<div class="r">
	<a href="" target="_blank" rel="nofollow" role="button" onclick="addShopCart();" >加入购物车<span class="ensureText" >确认</span></a>
</div>
</div>
</div>

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

点击商品进入详情页面 的相关文章

随机推荐

  • opencv-python下载地址

    https pypi org project opencv python history
  • Python3.x安装Pandas教程

    python3 x 安装pandas总是会出现一些乱七八糟的问题 那现在就给你们讲述一种超级简单的安装方法 非常简单 1 检查自己的python版本 我的是python3 4 32位的 2 https www lfd uci edu goh
  • Jupyter Notebook修改工作区默认路径

    Jupyter notebook启动后 默认的工作空间是当前用户目录 C Users 用户名 为了方便对文档进行管理 往往需要自行设置工作空间 下面是默认工作空间的设置方法 一 修改属性中目标位置 右击 jupyter notebook 快
  • Java JDBC(JdbcTemplate)对表的增删改查

    Java JDBC JdbcTemplate 对表的增删改查 先看 JDBCUtils 再看 JdbcTemplate简单使用 然后增删改查 package domain import JdU JDBCUtils import org ju
  • Unity3d 周分享(22期 2019.8.30 )

    选自过去1 2周 自己所看到外文内容 https twitter com unity3d 和各种其他博客来源吧 早就有了 抱歉才发 1 Unity Transform 性能优化摘要 https qiita com sator imaging
  • linux下搭建RabbitMQ操作

    引言 你是否遇到过两个 多个 系统间需要通过定时任务来同步某些数据 你是否在为异构系统的不同进程间相互调用 通讯的问题而苦恼 挣扎 如果是 那么恭喜你 消息服务让你可以很轻松地解决这些问题 消息服务擅长于解决多系统 异构系统间的数据交换 消
  • php isset 和 array_key_exists 检查数组中是否存在某值的区别

    原文地址 http ivhong com p 110 ivhong com 是我的博客主址 先看看下面这段代码 你觉得结果是什么呢 定义一个数组 gt 5 4 arr a gt null var dump isset arr array k
  • tilemap45度地图的斜向限定判断办法

    前段时间使用cocos2d x做一个小游戏用到了tilmap 而且是45度的tilemap 在正常的坐标系里面一般都是直角坐标系 但是这个东西可以是斜的 要想使用45度的tilemap地图就要进行坐标系的转换 有空再写怎么转换 然后看一些用
  • springboot面试题

    springboot常见面试题 https blog csdn net weixin 44772609 article details 115106450 常见面试题 谈谈你对Spring Boot的理解 SpringBoot主要用来简化使
  • HttpRunner 2.x接口自动化实战

    1 环境准备 测试环境 python3 8 httprunner版本为2 5 7 pip install httprunner 2 5 7 检查安装结果 httprunner V 创建项目 使用 httprunner命令创建一个项目 htt
  • pycharm引入anaconda创建的虚拟环境及对应的python解释器

    对于旧版的pycharm导入anaconda创建的虚拟环境及对应的python解释器 已经有很多解答 但是较新版本的pycharm引入anaconda的虚拟环境似乎有些不同 引入方式 第一步 进入settings 第二步 选择project
  • 企业电子招标采购系统源码Spring Boot + Mybatis + Redis + Layui + 前后端分离 构建企业电子招采平台之立项流程图

    功能模块 待办消息 招标公告 中标公告 信息发布 描述 全过程数字化采购管理 打造从供应商管理到采购招投标 采购合同 采购执行的全过程数字化管理 通供应商门户具备内外协同的能力 为外部供应商集中推送展示与其相关的所有采购业务信息 历史合作
  • 20.Python中Main 函数

    Python编程的术与道 Python语言进阶 视频课程 Python编程的术与道 Python语言进阶 视频课程链接 https edu csdn net course detail 28618 main函数 main函数就像程序的入口点
  • 腾讯云服务器安装宝塔面板教程(一键安装图文教程)建站准备

    腾讯云如何安装宝塔面板 腾讯云服务器安装宝塔面板图文教程 塔面板是一款服务器管理软件 用户可以通过Web端轻松管理服务器 提升运维效率 例如 创建管理网站 FTP 数据库 拥有可视化文件管理器 可视化软件管理器 可视化CPU 内存 流量监控
  • Vue3学习使用创建自定义指令

    简言 除了 Vue 内置的一系列指令 比如 v model 或 v show 之外 Vue 还允许你注册自定义的指令 Custom Directives 官网自定义指令 我们已经介绍了两种在 Vue 中重用代码的方式 组件和组合式函数 组件
  • 决策树和随机森林

    回归模型 1 信息熵 1 熵 2 联合熵 3 条件熵 4 互信息 2 决策树学习算法 1 决策树 2 决策树生成算法 3 信息增益 4 信息增益率 5 Gini系数 6 ID3算法举例 7 三种决策树学习算法 8 回归树 3 决策树的评价
  • c语言数组所含字节数,(C语言)数组所占字节怎么算?

    在C语言中 可以使用sizeof操作符来计算数组所占字节 sizeof操作符是专门用于检测类型或变量或数组在内存中所占有的空间 字节数 的 用它可以直接检测出数组在内存占有的字节数 C语言中有一个专门用于检测类型或变量或数组在内存中所占有的
  • c++之复杂类型作为unordered_map的键值

    unordered map unordered set 我们知道c 中有unordered map和unordered set这两个数据结构 其内部实现是哈希表 这就要求作为键值的类型必须是可哈希的 比如常见的数据类型int string等
  • group by以后如何count?

    原文 https www cnblogs com jimleestone p sql 001 html 当表数据量很庞大 需要使用sql的limit功能来分页时 需要发送两条sql才能实现分页 SELECT FROM tablename W
  • 点击商品进入详情页面

    需求 点击商品 进入对应商品的详情页面 实现 获取商品的Id运用 a 标签使用Url参数 将商品Id发送到Servlet 看url地址就知道发送请求时将商品id发送出去了 Html代码 a