2013-04-04 81 views
0

我試圖設置一個通知,只有當用戶單擊<a>標記3次纔會觸發。點擊後觸發jquery事件<a> 3次

要生成通知,我使用了一個名爲fancybox的jQuery lightbox。

到目前爲止,我已經有了fancybox所有的設置,但我不知道如何在標籤上點擊3次後才觸發它。

任何想法,我會這樣做?

我使用調用收藏夾JS是:

$(document).ready(function() { 
     $('.fancybox').fancybox(); 
    }); 

我設置一個jsFiddle to illustrate它。

+0

它是在第一頁點擊觸發..: O – writeToBhuwan 2013-04-04 12:32:44

+0

是的,多數民衆贊成在即時通訊有點麻煩,我希望它在3日點擊觸發 – sam 2013-04-04 12:33:24

回答

3

只要保持被點擊的元素的次數曲目:

var clicked = 0; 

$('.fancybox').on('click', function (e) { 
    clicked++; 

    if (clicked >= 3) { 
     clicked = 0; 
     $('.fancybox').fancybox(); 
    } else { 
     e.preventDefault(); 
    } 
}); 

FIDDLE

+1

這隻適用於第一次。之後,fancybox會在第一次點擊時始終開啓。我在調整代碼的地方添加了一個答案。 – JFK 2013-04-04 17:56:40

0

您可以創建一個點擊偵聽器,並保存點擊時更新的變量。

是這樣的:

var clickCounter = 0; 
object.addEventListener('click', function() { 
    clickCounter++; 
    if (clickCounter == 3) { 
     //Open it 
    } 
}); 
1

您可以使用.data()跟蹤:

$(document).ready(function() { 
    $('.fancybox').click(function(e) { 
     e.preventDefault(); 
     var $this = $(this), 
      count = ($this.data('click-count') || 0) + 1; 
     if (count === 3) { 
      $('.fancybox').fancybox(); 
     } 
     $this.data('click-count', count); 
    });   
}); 

演示:http://jsfiddle.net/XWHga/3/

使用.data()的優點是計數綁鏈接本身,所以如果你碰巧有多個環節來跟蹤沒有雜亂試圖跟蹤哪些外部計數器與屬於哪個鏈接。

+0

這隻適用於第一次。之後,fancybox會在第一次點擊時始終開啓。 – JFK 2013-04-04 18:09:24

+0

這是一個簡單的調整(只是使用'%') - 並不清楚它是每隔三次點擊的問題。 – jmar777 2013-04-04 18:23:19

3

@ adeneo的答案是正確的如果你想要的功能第一次只有。有了這些代碼,如果關閉fancybox,然後再次點擊鏈接ONCE,fancybox會在第一次點擊時觸發。

如果你想要的是的fancybox後任何時間的3次點擊ALWAYS射擊,然後調整@ adeneo的代碼是這樣的:

$(document).ready(function() { 
    var clicked = 0; 
    $('.fancybox').on('click', function (e) { 
     clicked++; 
     if (clicked >= 3) { 
      clicked = 0; 
     } else { 
      return false; 
     } 
    }).fancybox(); 
}); 

forked JSFIDDLE

+0

一個簡單的問題很好的答案。 +1 – writeToBhuwan 2013-04-05 08:27:36