javascript双击问题

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)。这就是为什么大多数人建议实现单击事件或双击事件而不是同时实现两者的原因。

如果您想同时检测双击，您需要对彼此接近的点击事件进行计时，并防止第二次点击，恢复第一次点击事件，并改为调用双击事件。

听起来您实际上并不需要双击？只是能够在单击幻灯片链接时切换到该幻灯片而不是转发到下一张幻灯片？