Javascript 防止函数多次单击而运行

很抱歉这个误导性的标题很难解释

基本上，我有一个函数，当你点击左/右时，一个div会以任意方式移动X像素

// Upcoming events slide 
$('.nextEvent').click(function(e){
    e.preventDefault();
    if($('.newsColWrap').offset().left == '597.5'){

    } else {
        $('.newsColWrap').stop(true,true).animate({'left' : "-=435px"},500)
    }
});
$('.prevEvent').click(function(e){
    e.preventDefault();
    if($('.newsColWrap').offset().left == '1032.5'){

    } else {
        $('.newsColWrap').stop(true,true).animate({'left' : "+=435px"},500);
    }
});

---

该函数工作正常，但是如果动画正在发生，并且您再次单击，因为if语句不会返回my div moves too far，这有意义吗

在再次设置元素动画之前，可以使用检查元素是否正在设置动画

$('.nextEvent').click(function(e){
    e.preventDefault();
    if($(this).is(':animated')) return; // check if currently being animated
    // ... animate
});

$('.prevEvent').click(function(e){
    e.preventDefault();
    if($(this).is(':animated')) return; // check if currently being animated
    // ... animate
});

---

在再次设置元素动画之前，可以使用检查元素是否正在设置动画

$('.nextEvent').click(function(e){
    e.preventDefault();
    if($(this).is(':animated')) return; // check if currently being animated
    // ... animate
});

$('.prevEvent').click(function(e){
    e.preventDefault();
    if($(this).is(':animated')) return; // check if currently being animated
    // ... animate
});

---

问题可能是您在上一个动画完成之前读取偏移，因此请重试

$('.nextEvent').click(function (e) {
    e.preventDefault();
    var $newsColWrap = $('.newsColWrap').stop(true, true);
    if ($newsColWrap.offset().left == '597.5') {

    } else {
        $newsColWrap.animate({
            'left': "-=435px"
        }, 500)
    }
});
$('.prevEvent').click(function (e) {
    e.preventDefault();
    var $newsColWrap = $('.newsColWrap').stop(true, true);
    if ($newsColWrap.offset().left == '1032.5') {

    } else {
        $newsColWrap.stop(true, true).animate({
            'left': "+=435px"
        }, 500);
    }
});

---

问题可能是您在上一个动画完成之前读取偏移，因此请重试

$('.nextEvent').click(function (e) {
    e.preventDefault();
    var $newsColWrap = $('.newsColWrap').stop(true, true);
    if ($newsColWrap.offset().left == '597.5') {

    } else {
        $newsColWrap.animate({
            'left': "-=435px"
        }, 500)
    }
});
$('.prevEvent').click(function (e) {
    e.preventDefault();
    var $newsColWrap = $('.newsColWrap').stop(true, true);
    if ($newsColWrap.offset().left == '1032.5') {

    } else {
        $newsColWrap.stop(true, true).animate({
            'left': "+=435px"
        }, 500);
    }
});

---

您可以使用一个简单的setTimeout函数运行500。

您可以使用一个简单的setTimeout函数运行500。

谢谢@Arun，这仍然允许我继续单击并将div移到最右边？@Liam在这种情况下，请尝试techfoobar的回答谢谢@Arun，不过，这仍然允许我继续单击并将div移到最右侧？@Liam在这种情况下，请尝试techfoobar的答案