javascript - javascript 中的线程

Question

我有函数 GoToCell(number); 此功能呈现玩家的 Action 。 我有这样的情况出现:这个人调用这个函数两次之前超过了最后一次调用的执行。 一个调用被挂断并从 2 个调用开始运行。我需要调用两个没有工作直到结束是不是怎么执行呢？

Answer 1

您遇到的问题可能与线程无关，而与动画或电影播放有关。很难从问题中分辨出来。

但在这两种情况下，答案都是确保您设置了一个标志，告诉自己动画或任何正在进行中，并在其上使用完成回调来清除该标志。然后，在用户单击小部件或其他任何内容时检查标志，并且不要启动动画的第二个副本等。

同样，没有任何代码或上下文，很难具体提供帮助，所以这里有一个使用 jQuery 动画的示例。我不是说“使用 jQuery”或其他任何东西，只是演示上面列出的概念(设置标志、防止重复激活、使用完成回调):

Live copy | source

HTML:

<input type="button" id="theButton" value="Click to animate">
<div id="target"></div>
<div id="output"></div>

CSS:

#target {
  position: absolute;
  left: 0px;
  top: 3em;
  border: 1px solid black;
  background-color: #00d;
  width: 20px;
  height: 20px;
}
#output {
  margin-top: 6em;
}

JavaScript:

jQuery(function($) {

  var animating = false;
  var direction = "+";

  $("#theButton").click(function() {
    // Are we already animating?
    // (Of course, ideally you'd disable the button or similar)
    if (animating) {
      // Yes, say we're busy
      display("Animation still in progress");
    }
    else {
      // No, do it
      display("Animating...");
      animating = true;
      $("#target").animate({
        left: direction + "100"
      }, 3000, function() {
        // Completion callback, we're not animating anymore
        animating = false;
        display("Done");
      });
      direction = direction === "+" ? "-" : "+";
    }
  });

  function display(msg) {
    $("<p>").html(String(msg)).appendTo("#output");
  }

});