我需要多次重复使用ID的帮助

时间:2018-12-15 19:59:21

标签: javascript

所以我正在做一个猜词游戏,

enter image description here

在我的Game.js文件中,我有一个名为Game的类,该类具有名为checkForwin()的方法,该方法检查玩家是否选择了游戏中的所有字母,它基于console.log

checkForWin() {
    //phraseMatch is the length of the empty boxes
const phraseMatch  = $('.letter').length;
//match is the length of the displayed boxes with the class of show
const match  = $('.letter.show').length;
//if the length of the empty boxes is equal to the length of the displayed boxes then return true
  if (phraseMatch === match) {
      console.log(phraseMatch + match + ' (the player has chosen all letters in the phrase')
    return true
  }

}

尽管我坚持使用的方法是gameOver(),但如果玩家输了,该方法将显示红屏,如果获胜则将显示绿屏, 我可以选择ID为h1的{​​{1}}来通过在玩家失败时添加类(“丢失a”)来更改消息和屏幕颜色,但是当我尝试

再次使用相同的ID
#game-over-message

我似乎无法通过添加css文件中具有的类(“ win a”)来显示ID来显示获胜颜色

else if (this.checkForWin === true || this.missed < 5)  {
        $('#game-over-message').text('You won!');
        $('#overlay').show().addClass('win a');
        $('#btn__reset').text('Try Again!');



    }

有人可以帮忙吗?这是我的参考资料https://github.com/SpaceXar20/FSJS-techdegree-project-4-b

2 个答案:

答案 0 :(得分:1)

我猜你的else if条件从未匹配

代替

this.checkForWin === true(由于它是一个函数,因此始终为假)

您要检查实际的返回值,因此必须执行

this.checkForWin() === true

通过使用console.log("xyz")进行调试,您可能发现自己没有执行

答案 1 :(得分:1)

我检查了您的代码。无法获得输出的原因是,仅当您错过5次机会时才调用游戏结束功能。如下所示在handleInteraction上调用gameOver(),您将获得输出。我还注意到,没有结束游戏的功能,您只需在控制台日志中说“玩家已选择词组中的所有字母”,然后在removeLife内显示红色的CSS更改,就可以简单地称做赢得CSS更改()您调用过gameOver()的地方;

handleInteraction(letter) {

    /*if the player matched a letter, the checkforwin method will be called
    and the letter will be shown by calling showedMatchedLetter()
    */
    if (phrase.checkLetter(letter) === true) {

        phrase.showMatchedLetter(letter);
        this.checkForWin();

    } //if the player didn't match a letter, the game will remove a heart life by calling removelife method and add 1 to the missed property
      else {
          this.removeLife();

      }

      this.gameOver();

}

希望您得到了答案:)