为js生成的class添加点击事件

最近写了一个功能，就是为公司网站的商品详情页写一个我常购买这么一个模块，具体长什么样的，大家可以跑到京东那边看下他的右边侧栏的那些东西就知道了

只是京东推荐的是“看了又看”，类似于淘宝的，看了商品的买家还看了...这类的也是真正所谓的大数据，而我写的是小数据，就是把买家之前买过的东西显示在右边的侧边栏。一次只显示3个商品，然后点击向下的按钮或向上的按钮，ul标签的top就会减小一定的px达成一种ul在运动的样子

跟上头沟通过后，决定如果买家的我常购买大于8个商品，那我常购买里的商品就随机显示8个也就是说在每次刷新详情页的时候右边侧边栏里的商品都是不一样的，当小于8个就全部显示，且顺序不会变化。

当然，这部分由后台来写，数据打乱用shuffle()方法。之前先判断数组长度，大于8再走shuffle方法。

至于为什么不在前端完成，理由主要是假使该客户之前买了很多商品，都加载出来，买家可能下完单了详情页里的侧边栏还没显示出来，再数据处理下，这网页差不多算费了，放后台速度先让会比在前端快。

废话完毕

用ajax调接口来获取我常购买的数据。这边遇到了两个之前没有遇到的情况

一、因为传来的每组数据是按商品的id来命名，所以以一般的for循环来循环数组是不对的，因为result[i]是undefine的。所以这里用for(var i in result)

但是这里值得注意的是，在数据循环完毕后，（这里假设有八组数据）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生成