Question

我有一个幻灯片，可以快速链接到特定的幻灯片。幻灯片然后从那一点继续。麻烦的是，如果我双击快速链接 - 当幻灯片继续时，它会跳过幻灯片（如果我高音点击它跳过2）。

我认为在函数运行时再次单击会导致问题，这实际上是一个问题，因为您可以在函数运行时快速单击其他链接来解决同样的问题。

这是我的代码......

var images=new Array();
var locationToRevealCount=6;
var nextimage=2;
var t;
var doubleclick;

addIcons();

function addIcons() {
    while (locationToRevealCount>0) {
        $("#extraImageButtons").append('<img class="galleryButtons" src="http://www.steveszone.co.uk/images/button_sets/pink_square_button1n.png" alt="'+locationToRevealCount+'" />');
        images[locationToRevealCount]='http://www.tombrennand.net/'+locationToRevealCount+'a.jpg';
        locationToRevealCount--;
    };
    $('.homeLeadContent').prepend('<img class="backgroundImage" src="http://www.tombrennand.net/1a.jpg" />');
    $("#extraImageButtons img.galleryButtons[alt*='1']").attr("src","http://www.steveszone.co.uk/images/button_sets/black_square_button1n.png");
    runSlides();
}

function runSlides() {
    clearTimeout(t);
    t = setTimeout(doSlideshow,3000);
}

function doSlideshow() {
    if($('.backgroundImage').length!=0)
        $('.backgroundImage').fadeOut(500,function() {
            $('.backgroundImage').remove();
            slideshowFadeIn();
        });
    else
        slideshowFadeIn();
}

function slideshowFadeIn() {
    if(nextimage>=images.length) 
        nextimage=1;

    $("#extraImageButtons img.galleryButtons").attr("src","http://www.steveszone.co.uk/images/button_sets/pink_square_button1n.png");
    $("#extraImageButtons img.galleryButtons[alt*='"+nextimage+"']").attr("src","http://www.steveszone.co.uk/images/button_sets/black_square_button1n.png");

    $('.homeLeadContent').prepend($('<img class="backgroundImage" src="'+images[nextimage]+'" style="display:none;">').fadeIn(500,function() {
        nextimage++;
        runSlides();

    }));
}

$("#extraImageButtons img.galleryButtons").live('click', function() {
    nextimage=$(this).attr("alt");
    $("#extraImageButtons img.galleryButtons").attr("src","http://www.steveszone.co.uk/images/button_sets/pink_square_button1n.png");
    $(this).attr("src","http://www.steveszone.co.uk/images/button_sets/black_square_button1n.png");
    clearTimeout(t);
    doSlideshow();
});

...

<div class="homeLeadContent" style="width:965px;"></div>

<div id="extraImageButtons"></div>

Answer 1

双击仍会触发两个单击事件...几乎所有时间，具体取决于浏览器（请参阅：Javascript Madness: Mouse Events）。这就是为什么大多数建议实施单击或双击事件，但不能同时实现两者。

如果你想同时检测双击，你需要进入彼此接近的定时点击事件并阻止第二次，恢复第一次，然后再调用双击事件。

听起来你实际上并不需要双击？只需点击滑动链接 - 切换到该幻灯片而不是转发到下一张幻灯片？

Answer 2

如果要完成禁用双击：

jQuery('.dblClickDisabled').bind('dblclick',function(e){
    e.preventDefault();
})

其中.dblClickDisabled是要禁用的DOM元素双击。

如果您不打算使用双击事件，只需放置一个计时器以防止双击。这个答案可能正是您所寻找的：How can jQuery be used to handle timer in click, dblclick separation

javascript双击问题

2 个答案: