$(function () { function Products(){ ? ? ? ? ? this.pic=$('.pic'); ? ? ? ? ? this.init() ? ?} ? ?Products.prototype={ ? ? ? init:function(){ ? ? ? ? this.bindEvent() ? ? ? }, ? ? ? ? bindDom:function(k){? ? ? ? ? ? ? ? ? ? ? ? ? var html = [ ? ? ? ? ? ? ? ? '<dl>', ? ? ? ? ? ? ? ? ? ? ?'<dt><a href="javascript:;"><img class="pic" src="'+k.image+'" width="384" height="225" /></a></dt>', ? ? ? ? ? ? ? ? ? ? ?'<dd>', ? ? ? ? ? ? ? ? ? ? ? ?'<span>', ? ? ? ? ? ? ? ? ? ? ? ? ?'<a href="javascript:;">', ? ? ? ? ? ? ? ? ? ? ? ? ?'<em>'+k.discount+'</em>'+k.title+'', ? ? ? ? ? ? ? ? ? ? ? ?'</a>', ? ? ? ? ? ? ? ? ? ? ?' </span>', ? ? ? ? ? ? ? ? ? ? '</dd>', ? ? ? ? ? ? ? ? ? ?'<dd class="price">', ? ? ? ? ? ? ? ? ? ? ?'<em>'+k.newPrice+'</em>', ? ? ? ? ? ? ? ? ? ? ?'<del>'+k.oldPrice+'</del>', ? ? ? ? ? ? ? ? ? ? ?'<i>'+k.time+'</i>', ? ? ? ? ? ? ? ? ? '</dd>', ? ? ? ? ? ? ? ? '</dl>' ? ? ? ? ? ? ].join(""); ? ? ? ? ? ? $("#container").append(html);? ? ? ? ?? ? ? ? ? }, ? ? ? ?bindEvent:function(){ ? ? ? ? ? ? ?var _this=this; ? ? ? ? ? ? this.pic.hover(function(){ ? ? ? ? ? ? ? ? $(this).css({'transform':'rotate(360deg)'}); ? ? ? ? ? ? },function(){ ? ? ? ? ? ? ? ? $(this).css({'transform':'rotate(0)'}); ? ? ? ? ? ? });? ? ? ? ? ? ? ? //總是最后一個元素不能觸發(fā)該旋轉事件,還望大神指教 ? ? ? ?} ? ?};? ? ? //data為獲得的json數據 ? ?$.each(data,function(i,v){? ? ? ? //v為數據每一項 ? ? ? ?new Products().bindDom(v) ? ?})})
一段簡單的代碼,有點小bug,為什么在綁定的事件中總是最后一個元素不能觸發(fā)事件呢?還望大神指教
慕標1076333
2017-10-13 12:00:07