显示警报信息答案

【问题标题】：Show alert message显示警报信息
【发布时间】：2019-04-27 01:42:33
【问题描述】：

这是一个分数不断增加但没有任何显示的游戏，所以我想添加一条提示消息，显示您在获得 5 分后获胜。我该怎么做？

cycleColor = function() {
    ++curColor;
    if (curColor == colors.length) {
      curColor = 0;
    }
    jello.className = "jello " + colors[curColor];
  },
  checkColorMatch = function() {
    if (curColor == nextMatchColor) {
      ++streak;
      dur -= 10;
      if (dur < minDur) {
        dur = minDur;

      }
      streakCounter.innerHTML = streak;
    } else {
      streak = 0;
      dur = 2000;
      streakCounter.innerHTML = "";
    }

    prevMatchColor = nextMatchColor;
    nextMatchColor = chooseColor();

    boxes[0].className = "box " + colors[prevMatchColor];
    boxes[1].className = "box " + colors[nextMatchColor];

    rerun();
    setTimeout(checkColorMatch, dur);
  };

main.classList.add("run");
jello.classList.add(colors[curColor]);
boxes[0].classList.add(colors[prevMatchColor]);
boxes[1].classList.add(colors[nextMatchColor]);

for (b in boxes) {
  if (b < boxes.length) {
    boxes[b].classList.add(colors[chooseColor()]);
  }
}

【问题讨论】：

标签： javascript

【解决方案1】：

如果您只需要一条简单的弹出消息，只需使用alert() 方法。

alert("You won!");

编辑：
将++streak; 替换为如下内容：

    if(++streak === 5){
        alert("You won!");
        //whatever other things you need to do when the player wins
        return;
    }

【讨论】：

我想知道的是我可以在条件中添加什么以及我应该在哪里写？
您使用什么变量来跟踪分数？是streak吗？
是的，它是streak
我已编辑我的答案以解决您的其余问题。

【解决方案2】：

我会改变这个功能：

 checkColorMatch = function() {
if (curColor == nextMatchColor) {
  ++streak;
  dur -= 10;
  if (dur < minDur) {
    dur = minDur;

  }
  streakCounter.innerHTML = streak;
     if (streak=="5"){
   alert("You won!");
    }

} else {
  streak = 0;
  dur = 2000;
  streakCounter.innerHTML = "";
}

prevMatchColor = nextMatchColor;
nextMatchColor = chooseColor();

boxes[0].className = "box " + colors[prevMatchColor];
boxes[1].className = "box " + colors[nextMatchColor];

rerun();
setTimeout(checkColorMatch, dur);
  };

现在，如果您需要它每 5 点提醒一次，那么您需要为每 5 点循环一个计数器。像这样：

   checkColorMatch = function() {
if (curColor == nextMatchColor) {
  ++streak;
  ++score5;
  dur -= 10;
  if (dur < minDur) {
    dur = minDur;

  }
  streakCounter.innerHTML = streak;
     if (score5=="5"){
   alert("You won! 5 points");
    score5=0;
    }

} else {
  streak = 0;
  dur = 2000;
  score5=0;
  streakCounter.innerHTML = "";
}

prevMatchColor = nextMatchColor;
nextMatchColor = chooseColor();

boxes[0].className = "box " + colors[prevMatchColor];
boxes[1].className = "box " + colors[nextMatchColor];

rerun();
setTimeout(checkColorMatch, dur);
};

但我确实质疑您使用 innerhtml 函数的兼容性。也许它需要是

       document.getElementById("streakCounter.").innerHTML

而不是

        streakCounter.innerHTML

【讨论】：