ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

黑马javaWeb项目,黑马旅游网-旅游线路详情页面-学习扩展

2021-11-28 22:00:44  阅读:173  来源: 互联网

标签:javaWeb 标签 第一张 线路 旅游网 dtStr 页面 黑马 图片


1、在完成旅游线路详情页面之后,发现刷新页面后,左侧的大图片会默认显示预先定义的一张图片,而不是每个routeImgList集合中的第一张图片。

2、因此,在老师完成的基础上,修改一下这个小问题,使得每次刷新页面或者点击另一个旅游线路后,左侧大图片默认显示各个线路中的第一张图片。

3、找到默认大图片的html标签:

<dt>
<img alt="" class="big_img" src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m49788843d72171643297ccc033d9288ee.jpg">
</dt>

4、给<dt>标签设置一个属性id=“dt”,在js代码中,定义一个空的变量dtStr,在遍历routeImgList时,拼接字符串,设置此变量中的src图片路径为每个图片集合的第一张图片。

dtStr = '<img alt="" class="big_img" src="'+route.routeImgList[0].bigPic+'">\n';

注意:经过我的试验发现,图片集合中的bigPic与smallPic这两张图片完全相同,存放两个相同图片的原因可能是,前端图片翻滚js代码需要。

5、将设置好值的<dt>标签,展示到页面中。

$("#dt").html(dtStr);

标签:javaWeb,标签,第一张,线路,旅游网,dtStr,页面,黑马,图片
来源: https://www.cnblogs.com/JichangNote/p/15616818.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有