javascript - 如何在使用jQuery单击后仅附加一次数据

Question

所以，我有这个小功能：

carousel_controls_buttons.live('click', function(e){
    setTimeout(function(){
       info_board_span.append(info_board_description);
       e.preventDefault();
    }, 450);
});

我想要做的是info_board_description在两次、三次快速点击后停止追加一次以上。当我这样做时，这些数据会附加一次以上，并且我有内容重复。我怎样才能停止这个一段时间，这个 450 毫秒？谢谢帮助。

Answer 1

使用布尔值来控制它。

var flag = true;
carousel_controls_buttons.live('click', function(e){
    e.preventDefault();
    if (flag) {
       setTimeout(function(){
           info_board_span.append(info_board_description);
           flag = true;
       }, 450);
       flag = false;
    }
});

Answer 2

您可以使用clearTimeout功能：

var t = '';
carousel_controls_buttons.live('click', function(e){
    clearTimeout(t);
    t = setTimeout(function(){
          info_board_span.append(info_board_description);
          e.preventDefault();
    }, 450);
});

示例：http: //jsfiddle.net/xhSvC/

请注意，live不推荐使用方法，您应该改用on方法。

Answer 3

虽然其他答案应该有效，但我想向您介绍debounce&的概念throttle。

http://benalman.com/projects/jquery-throttle-debounce-plugin/是一个你可以用来实现你需要的插件，即确保一个函数每x秒只执行一次。

油门与去抖动

节流和去抖动都会限制函数的执行，但哪种情况适合特定情况？

好吧，简单地说：虽然节流将函数的执行限制为每延迟毫秒不超过一次，但去抖动保证函数只会执行一次（给定指定的阈值）。

carousel_controls_buttons.live('click', function(e) {
    $.debounce(450, function() {
       info_board_span.append(info_board_description);
       e.preventDefault();
    });
});

Answer 4

在那边放一个计数说 var count=0; 命中时增加并检查条件如果 count==1 如果不离开则附加它

Answer 5

有一个事件可以实现这一目标：

carousel_controls_buttons.one('click', function() {
  setTimeout(function(){
       info_board_span.append(info_board_description);
       e.preventDefault();
    }, 450);
});