事情是这样的,昨天前端小姐姐写了一个点击加入购物车,商品图就飞入购物车的超炫效果,做好了我拿过来套,结果整合代码的时候发现,放到我自定义的js函数体里面竟然报错“event is not defined”,用的是火狐浏览器,Firebug显示如下:
关于event事件上网学习了一下:
【W3scholl】HTML DOM Event 对象
【简书】事件Event详解
首先要确定的是,要用onlick="test();"这种方式才能触发事件,一开始我这样写<a herf="javascript:test();">会报下面的错:
然后发现坑爹的火狐浏览器获取不到event事件,要加上下面这行声明一下event:
var event = window.event || arguments.callee.caller.arguments[0];
这样就不会报错了,代码使用片段如下:
function flycar(){
var event = window.event || arguments.callee.caller.arguments[0];
var offset = $(".myCart").offset();
var addcar = $(this);
var img = $(".goodsImg").attr('src');
var flyer = $('<img style="display:block;width:50px;height:50px;border-radius:50px;position:fixed;z-index:9999;" src="'+img+'">');
flyer.fly({
start: {
left: event.pageX, //开始位置(必填
top: event.pageY //开始位置(必填)
},
end: {
left: offset.left+15, //结束位置(必填)
top: offset.top, //结束位置(必填)
width: 0, //结束时宽度
height: 0 //结束时高度
},
onEnd: function(){
endcar();
}
});
}