2011-03-30 67 views
2

我有一個幻燈片,它可以快速鏈接到特定的幻燈片。幻燈片從那一點開始繼續。麻煩的是,如果我雙擊一個快速鏈接 - 當幻燈片繼續播放幻燈片(如果我高音單擊它跳過2)。javascript雙擊問題

我認爲這實際上是一個問題,在功能運行的時候再次點擊會導致問題,因爲通過在功能運行時快速點擊其他鏈接可以實現同樣的問題。

這裏是我的代碼...

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> 

回答

1

雙擊仍然觸發兩個單點擊事件......以及幾乎所有的時間,這取決於瀏覽器(見:Javascript Madness: Mouse Events)。這就是爲什麼大多數人推薦實現單點擊或雙擊事件,但不是兩種。

如果您想要在同一時間檢測到雙擊,則需要進入時間點擊事件鄰近度,並防止第二次,第一次返回,然後調用雙擊事件。

聽起來你實際上並不需要雙擊嗎?只需在點擊幻燈片鏈接時切換到該幻燈片而不是轉發到下一張幻燈片?

+0

想想我可能會說這個錯誤......我不希望能夠雙擊...這是一個與第二次(和隨後)點擊的問題時功能正在運行。 – Tom 2011-03-30 16:51:55

+0

@Tom你有一個頁面,我們可以看到這個工作/看到問題? – Rudu 2011-03-31 17:14:08

1

如果你想完成禁用雙擊:

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

哪裏.dblClickDisabled是要禁用雙擊的DOM元素。

如果您不打算使用雙擊事件,只需放置一個計時器以防止雙擊。 這個答案可能是你正在尋找的:How can jQuery be used to handle timer in click, dblclick separation

+0

聽起來真棒......但是怎麼樣?我已經把自己綁在了這個結上,只是無法解決問題。 – Tom 2011-03-30 16:53:11

+0

更新了答案。 – Marcus 2011-03-31 08:06:00