gpt4 book ai didi

javascript - event.stopImmediatePropagation();适用于除 Firefox 以外的所有浏览器

转载 作者:搜寻专家 更新时间:2023-10-31 22:45:47 25 4
gpt4 key购买 nike

我有一个用于创建图像轮播的 jQuery 代码。我知道这不是最优雅的代码。

jQuery(function(){
$(".project").css('max-height','180px'); //180px
var expanded = 0;
var position = 0;
x = 0;


$(".project").click(function(){
if (expanded == 0){
$(this).css('max-height','320px');
expanded = 1;
$(this).find('.projectcarousel').find('.control').fadeIn(300);
$(this).find('.projectcarousel').find('.control').css('display','block');
$(this).find('.projectdescription').find('.tags').fadeIn(500);
$(this).css('opacity','1');
}
else if (expanded == 1){
$(this).css('max-height','180px');
$(this).find('.projectcarousel').find('.control').fadeOut(300);
$(this).find('.projectdescription').find('.tags').fadeOut(500);
$(this).find('.viewscreen').find('.carousel').css('-moz-transform','translate(0,0)');
$(this).find('.viewscreen').find('.carousel').css('-webkit-transform','translate(0,0)');
$(this).find('.viewscreen').find('.carousel').css('-o-transform','translate(0,0)');
$(this).find('.viewscreen').find('.carousel').css('transform','translate(0,0)');
expanded = 0;
position = 0;
x = 0;
}
});

$('.prev').click(function(){
event.stopImmediatePropagation();

switch(position){
case 0:
x = "-420px"
position = 1;
break;

case 1:
x = "-840px"
position = 2;
break;

case 2:
x = "-1260px"
position = 3;
break;

case 3:
x = "-1680px"
position = 4;
break;

default:
x = 0;
position = 0;
}

$(this).parent().parent().next().find('.carousel').css('-moz-transform','translate('+x+',0)');
$(this).parent().parent().next().find('.carousel').css('-webkit-transform','translate('+x+',0)');
$(this).parent().parent().next().find('.carousel').css('-o-transform','translate('+x+',0)');
$(this).parent().parent().next().find('.carousel').css('transform','translate('+x+',0)');
});

$('.next').click(function(){
event.stopImmediatePropagation();

switch(position){

case 0:
x = "-1680px"
position = 4;
break;

case 1:
x = "0px"
position = 0;
break;

case 2:
x = "-420px"
position = 1;
break;

case 3:
x = "-840px"
position = 2;
break;

case 4:
x = "-1260px"
position = 3;
break;

default:
x = 0;
position = 0;
}

$(this).parent().parent().next().find('.carousel').css('-moz-transform','translate('+x+',0)');
$(this).parent().parent().next().find('.carousel').css('-webkit-transform','translate('+x+',0)');
$(this).parent().parent().next().find('.carousel').css('-o-transform','translate('+x+',0)');
$(this).parent().parent().next().find('.carousel').css('transform','translate('+x+',0)');
});
});

event.stopImmediatePropagation(); 适用于 Chrome、Opera 和 Safari,但不适用于 Firefox。我试过使用 event.stopPropagation()event.preventDefault(); 但这两个代码都不起作用。

我从 Firefox 收到的错误是“不推荐使用 getPreventDefault()”。请改用 defaultPrevented' 和 'ReferenceError: event is not defined'。

我是否以错误的方式使用了代码,或者 Firefox 中是否存在我应该注意的错误?

最佳答案

为所有 jQuery 事件处理程序使用 jQuery 的规范化事件对象,它作为第一个参数传递给回调函数:

$('.next').click(function(e){ // added the 'e' parameter
e.stopImmediatePropagation(); // uses jQuery's event object, referenced by e

请注意,我已将其命名为 e,但您可以随意命名它,只要它是一个有效的 JavaScript 标识符即可。我选择 e 是因为它很短(只有一个字符),相对明确(我知道它指的是一个代表事件的对象),而且我不太可能隐藏任何其他具有同名。

关于javascript - event.stopImmediatePropagation();适用于除 Firefox 以外的所有浏览器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19495013/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com