为js生成的class添加点击事件
2017-10-31 14:20
260 查看
最近写了一个功能,就是为公司网站的商品详情页写一个我常购买这么一个模块,具体长什么样的,大家可以跑到京东那边看下他的右边侧栏的那些东西就知道了
只是京东推荐的是“看了又看”,类似于淘宝的,看了商品的买家还看了...这类的也是真正所谓的大数据,而我写的是小数据,就是把买家之前买过的东西显示在右边的侧边栏。一次只显示3个商品,然后点击向下的按钮或向上的按钮,ul标签的top就会减小一定的px达成一种ul在运动的样子
跟上头沟通过后,决定如果买家的我常购买大于8个商品,那我常购买里的商品就随机显示8个也就是说在每次刷新详情页的时候右边侧边栏里的商品都是不一样的,当小于8个就全部显示,且顺序不会变化。
当然,这部分由后台来写,数据打乱用shuffle()方法。之前先判断数组长度,大于8再走shuffle方法。
至于为什么不在前端完成,理由主要是假使该客户之前买了很多商品,都加载出来,买家可能下完单了详情页里的侧边栏还没显示出来,再数据处理下,这网页差不多算费了,放后台速度先让会比在前端快。
废话完毕
用ajax调接口来获取我常购买的数据。这边遇到了两个之前没有遇到的情况
一、因为传来的每组数据是按商品的id来命名,所以以一般的for循环来循环数组是不对的,因为result[i]是undefine的。所以这里用for(var i in result)
但是这里值得注意的是,在数据循环完毕后
8e77
,(这里假设有八组数据)i不是8而是9(0~8),而如果是用for(var i=0;i<8;i++)打印 i 则是0~7。
二、将传来的数据渲染到页面上。这里因为是用ajax写的,所以在ajax调取接口获取成功情况下,渲染到页面。这里用$(".xx").append(html)方法。
遇到了一个问题,点击向上或向下的按钮没有反应。
这个问题之前也遇到过,之前是由$(".father").on("click","child",function(){})解决,但是这次却不能解决。(这里的father类是child类的父类)
主要原因是这里的.father也要是html生成不能是js生成,而我一开始的father类也是js生成的所以没有动静
总结
for...in在数组循环完毕后会多一个数,即数组有八个数,但是最后会循环9次
由js生成的class不能添加点击事件,解决方案:$(".father").on("click","child",function(){}) .father由html生成
只是京东推荐的是“看了又看”,类似于淘宝的,看了商品的买家还看了...这类的也是真正所谓的大数据,而我写的是小数据,就是把买家之前买过的东西显示在右边的侧边栏。一次只显示3个商品,然后点击向下的按钮或向上的按钮,ul标签的top就会减小一定的px达成一种ul在运动的样子
跟上头沟通过后,决定如果买家的我常购买大于8个商品,那我常购买里的商品就随机显示8个也就是说在每次刷新详情页的时候右边侧边栏里的商品都是不一样的,当小于8个就全部显示,且顺序不会变化。
当然,这部分由后台来写,数据打乱用shuffle()方法。之前先判断数组长度,大于8再走shuffle方法。
至于为什么不在前端完成,理由主要是假使该客户之前买了很多商品,都加载出来,买家可能下完单了详情页里的侧边栏还没显示出来,再数据处理下,这网页差不多算费了,放后台速度先让会比在前端快。
废话完毕
用ajax调接口来获取我常购买的数据。这边遇到了两个之前没有遇到的情况
一、因为传来的每组数据是按商品的id来命名,所以以一般的for循环来循环数组是不对的,因为result[i]是undefine的。所以这里用for(var i in result)
但是这里值得注意的是,在数据循环完毕后
8e77
,(这里假设有八组数据)i不是8而是9(0~8),而如果是用for(var i=0;i<8;i++)打印 i 则是0~7。
二、将传来的数据渲染到页面上。这里因为是用ajax写的,所以在ajax调取接口获取成功情况下,渲染到页面。这里用$(".xx").append(html)方法。
遇到了一个问题,点击向上或向下的按钮没有反应。
这个问题之前也遇到过,之前是由$(".father").on("click","child",function(){})解决,但是这次却不能解决。(这里的father类是child类的父类)
主要原因是这里的.father也要是html生成不能是js生成,而我一开始的father类也是js生成的所以没有动静
总结
for...in在数组循环完毕后会多一个数,即数组有八个数,但是最后会循环9次
由js生成的class不能添加点击事件,解决方案:$(".father").on("click","child",function(){}) .father由html生成
相关文章推荐
- JS为循环动态生成的节点添加点击事件
- js/jq动态添加Class,无法添加点击事件
- JS为循环动态生成的节点添加点击事件
- js生成动态表格并为每个单元格添加单击事件的方法
- js中class的点击事件没有效果的解决方法
- js为li列表添加点击事件
- JS为表格每行添加点击事件
- js动态添加点击事件
- 42.生成标签添加点击事件this事件指向
- js 动态生成div 并添加class id
- js动态生成html,获取点击的监控事件写法
- JS动态生成表单,并添加行双击事件
- customPage.class.php可添加js事件的分页类
- JS整理,getCookie, getElementsByClassName , 添加删除事件
- JS生成DOM元素点击事件不生效和点击事件禁止冒泡处理方式
- 解决js添加一个按钮,让这个按钮也获得初始的事件,绑定到新生成的DOM
- js添加事件,比如点击事件传参,或者jqgrid行点击事件
- js 循环添加点击事件
- JS 循环li添加点击事件 (闭包的应用)
- ios手机 按钮点击事件没反应(这个按钮是js生成的)