0

我试图组织我的 JS 函数，一个接一个地整齐地出现onClick。目前他们都在乱开火，乱跑；而不是Click = 1 这样做；并 Click = 2 执行此操作。任何指针？下面是我的 JS。完整的演示链接可见：' http ://bit.ly/10BW89N '。您可以通过访问我的演示并注意到点击没有按照 1、2、3、4 等的顺序来理解我的意思——自始至终。

单击钉头，注意单击 3 突然跳到单击 8。我正在尝试这样做，以便可以根据特定的单击次数轻松添加功能。例如。第 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);
}

在以前的项目中——在视频中定义自定义提示点；我找到了一个巧妙地调用和声明自定义提示点的解决方案，如下所示；如果我可以用 CLICKS 做类似的事情，那就太酷了（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"
}
4

1 回答 1

0

我想你应该怎么做才能让你的函数以正确的顺序执行/在 n 次点击之后你可以执行以下操作：

首先，不要将函数的引用存储在数组中，而是将它们存储在哈希中，如下所示：

    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];

希望这能解决您的问题。

于 2013-07-04T20:10:08.403 回答