JS函數每次點擊觸發，計數點擊，並按

Question

我試圖組織我的JS函數發生，整齊地，onClick一個接一個。目前，他們都在亂髮亂鬧，而不是Click = 1這樣做;並點擊= 2是否這樣。任何指針？以下是我的JS。完整的演示鏈接可以在'http://bit.ly/10BW89N'處看到。你可以通過訪問我的演示來了解我的意思，並注意到點擊並不按照1,2,3,4等的順序。

點擊nailhead，注意點擊3突然跳過點擊8.我試圖做到這一點，所以我可以輕鬆地添加每個特定的點擊數的功能。 EG。第30次點擊，最後一次點擊，確實很酷但是它必須在第30次點擊時纔開火，而不是像第3次那樣擊敗目標。

$(document).ready(function() { 
    var a1_Events = [function1, function2, function3, function5, function6, function7, function8], 
     a1_c = 0; 
    function function1() { 
     alert('Click 1!'); 
    } 
    function function2() { 
     alert('Click 2!'); 
    } 
    function function3() { 
     $("#area1").hide(); 
     $("#area2").show(); 
     alert('Click 3!'); 

    } 
    function function5() { 
     alert('Click 4!'); 
    } 
    function function6() { 
     $("#bg_div").hide(0).delay(1500).show(0); 
     $("#bg_skew").show(0).delay(1500).hide(0); 
     alert('Click 5!'); 

    } 
    function function7() { 
     alert('Click 6!'); 
    } 
    function function8() { 
     $("#area1").hide(0).delay(1500).show(0); 
     $("#area2").hide(0).delay(1500).show(0); 
     $("#sound1").show(0).delay(4500).hide(0); 

      document.getElementById("id1").play(); // OK.. 

     $("#hammer").show(0).delay(1500).hide(0); 
     $("#youwin").show(0).delay(3500).hide(0); 
     alert('Click 7!'); 


    } 
    $('#area1').click(function() { 
     a1_Events[a1_c++ % a1_Events.length](); 
    }); 
    $("#area2").click(function() { 
     $("#area1").show(); 
     $("#area2").hide(); 
      alert('Click 8!'); 
    }); 
}); 

function alert(msg) { 
    $("#alert").text(msg).show(0).delay(1500).hide(0); 
} 

在以前的項目 - 在視頻中定義自定義提示點;我找到了一個整潔地打電話的解決方案，並聲明如下的自定義提示點;這將是COOL（http://www.urbandictionary.com/define.php?term=cool）如果我可以做類似的點擊;並組織我目前的功能整齊地出現，每次點擊都與我的提示點類似，所以我可以輕鬆地添加每個功能;並更新每次點擊會發生什麼

$(document).ready(function(){ 
//Slides object with a time (integer) and a html string 
var slides = { 
0: "This is the first subtitle. You can put html in here if you like", 
4: "A fluffy thing eating some grass.", 
12: "Oh look it's a castle on a hill. Nice", 
23: "Some horses", 
34: "Wow look at those woolly sheep eating grass.", 
40: "For more information on this plugin visit github/owainlewis or email owain@owainlewis.com", 
50: "Cuepoint.js is an open source plugin for adding subtitles and cue-points to your HTML5 video" 
} 

Answer 1

我猜你應該做的讓你的函數執行正確的順序/後點擊施氮量，你可以做到以下幾點：的

首先，不是存儲引用數組中的函數，將它們存儲在散列中，如下所示：

var a1_Events = { 
     1: function1, 
     3: function2, 
     7: function3, 
     12: function5, 
     20: function6, 
     23: function7, 
     30: function8 
    }, 
    a1_c = 0; 

將該數設置爲該函數應執行的點擊次數。然後在您單擊處理額外遞增點擊計數al_c你做：

$('#area1').click(function() { 
     al_c++; 
     if (a1_Events[al_c] !== undefined) { 
     al_Events[al_c](); 
     } 
    }); 

基本上你增加的點擊次數，然後嘗試查找是否有您的散列對應的量的函數點擊，如果有一個你執行它。

有了這個解決方案，您可以輕鬆地添加功能，以您的哈希值，如：

al_Events[33] = function12; 

，並刪除它們：

delete al_Events[3]; 

希望這能解決你的問題。