我想要吧那个click事件变成onclick事件,就是把下面的一段js改写成一个方法
这是html<p class="box">
<img src="images/lg.jpg" width="180" height="180">
<h4>¥<span>3499.00</span></h4>
<p>LG 49LF5400-CA 49寸IPS硬屏富贵招财铜钱设计</p>
<a href="#" class="button orange addcar">加入购物车</a>
</p>
<p class="box">
<img src="images/hs.jpg" width="180" height="180">
<h4>¥<span>3799.00</span></h4>
<p>Hisense/海信 LED50T1A 海信电视官方旗舰店</p>
<a href="#" class="button orange addcar">加入购物车</a>
</p>
<p class="box">
<img src="images/cw.jpg" width="180" height="180">
<h4>¥<span>¥3999.00</span></h4>
<p>Skyworth/创维 50E8EUS 8核4Kj极清酷开系统智能液晶电视</p>
<a href="#" onclick="" class="button orange addcar">加入购物车</a>
</p>
<p class="box">
<img src="images/ls.jpg" width="180" height="180">
<h4>¥<span>6969.00</span></h4>
<p>乐视TV Letv X60S 4核1080P高清3D安卓智能超级电视</p>
<a href="#" onclick="" class="button orange addcar">加入购物车</a>
</p>
这是js$(function() {
var offset = $("#end").offset();
$(".addcar").click(function(event){
var addcar = $(this);
var img = addcar.parent().find('img').attr('src');
var flyer = $('<img class="u-flyer" src="'+img+'">');
flyer.fly({
start: {
left: event.pageX, //开始位置(必填)#fly元素会被设置成position: fixed
top: event.pageY //开始位置(必填)
},
end: {
left: offset.left+10, //结束位置(必填)
top: offset.top+10, //结束位置(必填)
width: 0, //结束时宽度
height: 0 //结束时高度
},
onEnd: function(){ //结束回调
$("#msg").show().animate({width: '250px'}, 200).fadeOut(1000); //提示信息
addcar.css("cursor","default").removeClass('orange').unbind('click');
this.destory(); //移除dom
}
});
});
是想要這樣嗎?
首先将所有的页面上的
换成
js里面添加方法
上面的诸位已经给予了转成方法的例子。这里我补充点个人的意见。
可以修改为
然后只要指向$('a.btn'),就可以都绑定上该事件,不需要onclick。或者特别情况下,可以改为$('a.btn').attr('href', javascript:方法)这种形式(兼容性更好)。
这样就可以保证html是纯结构型,而通过class的独特命名来指明对象。