4

我正在创建一个打地鼠风格的游戏，其中给出了一个总和，数字从容器底部到顶部动画。游戏的目的是点击总和的正确答案并收集尽可能多的正确答案。

我的问题是用户可以多次单击数字和其他图标，导致它崩溃。有没有办法克服这个问题？

我试过这个jQueryone函数

$(".character").one("click", function() {
});

但是图标重新出现，所以我需要它们再次可点击。

我也试图设置一个超时时间，但似乎无法让它工作。有人可以将e指向正确的方向。

    setTimeout(function() {
    $(".character").one("click", function() {
    });
}, 3000);

小提琴：http: //jsfiddle.net/GvNB8/

4

2 回答 2

3

您的主要问题是重新显示角色时您没有与角色互动。在这种情况下，阻止用户单击的唯一方法是构建一种方法来防止在超时后快速连续单击两次。

该方法看起来像这样：

function clickThrottled(fn) {
  var click = true;
  return function () {
    if(click) {
      click = false;
      fn.apply(this, arguments);
      setTimeout(function () { click = true; }, 1000);
    }
  };
}

然后，您可以像这样使用该函数：

$('.character').click(clickThrottled(function () {
   // do your one time magic.
}));

我在这里使用的是 JavaScript 闭包。传递给 click 事件处理程序的函数只会调用底层函数一次，然后忽略所有调用 1 秒钟，然后重新启用自身。

我仍然建议您使用一种正常的方法，即在将元素重新绘制到屏幕上时重新启用它们 - 但上述方法也有效..

于 2013-01-15T09:21:51.710 回答
1

为什么不只是添加一条信息表明该项目已被点击：

$(".character").click(function(){
    if(!$(this).data("hasBeenClicked")) {
        $(this).data("hasBeenClicked", true);
        // the rest of your logic ...
    }
});
于 2013-01-15T09:27:58.383 回答