Question

这是我的第一个JS问题。我有这个函数在setInterval中。所以这个功能会重复出现。

function chooseAnswer() {
correct.onclick = function() {
    if (range == 0) {
        score++;
        isGameOver = false;
    }
    else {
        isGameOver = true;
    }
}

incorrect.onclick = function() {
    if (range != 0) {
        score++;
        isGameOver = false;
    }
    else {
        isGameOver = true;
    }
}

// Display score
displayScore.innerHTML = score;
}

除了得分（innerHTML）在点击触发后不立即更新外，一切都运行良好。它会等到下一轮时间间隔才能更新。但是，如果我搬家

displayScore.innerHTML = score;

然后把它放在

之后

score++;

在任一if语句中，分数将在触发onlick后立即更新。为什么会这样？无论setInterval如何，此函数都不能独立工作吗？也就是说，它逐行执行，所以

displayScore.innerHTML = score;

会立即更新，不必等到下一轮。

Answer 1

这是一个更多的评论，但因为它很长，我会写在这里：

这与循环中的continue无关。调用chooseAnswer时，无论是手动还是setInterval。然后执行三个语句：

将回调分配给correct.onclick
将回调分配给incorrect.onclick
displayScore.innerHTML = score;

当时回调本身只存储在onclick中，但是当时没有执行/评估它们。只有在您点击correct或incorrect时，浏览器才会检查回调是否存储在onclick中，如果有回调，则会执行回调。但是这个回调只包含这个代码：

function() {
  if (range == 0) {
    score++;
    isGameOver = false;
  } else {
    isGameOver = true;
  }
}

以下代码与您的代码相同，但具有其他结构，可能更容易理解：

function correctCallback() {
  if (range == 0) {
    score++;
    isGameOver = false;
  } else {
    isGameOver = true;
  }
}

function incorrectCallback() {
  if (range != 0) {
    score++;
    isGameOver = false;
  } else {
    isGameOver = true;
  }
}

function chooseAnswer() {
  correct.onclick = correctCallback; //correctCallback is not call but just assigned to correct.onclick
  incorrect.onclick = incorrectCallback; //incorrectCallback is not call but just assigned to correct.onclick

  // Display score
  displayScore.innerHTML = score;
}

更多的是，一遍又一遍地覆盖区间中的onclick是没有意义的。

JavaScript - innerHTML不会在setInterval中独立运行

1 个答案: