Question

作为其他几个人，我正在努力为班级建立一个刽子手游戏。所有事情都或多或少都有效，但不知何故，当生活=== 0 时，我正在努力阻止剧本。脚本一直在运行，只是不断扣除生命......

我尝试以多种方式附加if语句，但必须遗漏某些内容......

有人可以看看并帮助我理解我做错了吗？

＆＃13;

 
var word = "Flower";
var gameOptions = ["Flower", "Fruit", "Table", "Chair", "Love", "Family", "Water", "Picture", "Refrigerator", "Giraffe"]
 // The word we will use to play, will be randomized later
var gameOptionsLength; // The comptuer needs to know the length of the array, so we can set the upper limit for the random function
var computerChoice; // Computer will pick random word from gameOptions array
var gameWord; // This variable will transform the computer choosen string into an upper case string
var gamewordLength; // In order to show the right character amout to be guessed, we need to know the word length
var blanks= "";
var winword="";
var userInput;
var lives = 6; // According to Wikipedia, the user has 6 lives
var alphabet;
var outputElement;
var guessedLetters = []; // stores the letters the user guessed

gameOptionsLength = gameOptions.length;

computerChoice=gameOptions[Math.floor(Math.random() * gameOptionsLength)];
        console.log("computer choice " + computerChoice);

gameWord = computerChoice.toUpperCase();
gamewordLength = gameWord.length;

var j = 0;  // Creates the blanks i.e. Flower has 6 characters and needs 6 blanks _ _ _ _ _ _
while (j < gamewordLength) {
    blanks += " _";
    j++;
   }

var j = 0;  // Creates the blanks i.e. Flower has 6 characters and needs 6 blanks _ _ _ _ _ _
while (j < gamewordLength) {

    winword += " "+ gameWord.charAt(j);
    j++;



alphabet = 'abcdefghijklmnopqrstuvwxyz'.split('');
outputElement = $('#guessed-letters');


$(document).on('keyup', function (event) {
  var key = event.key.toLowerCase();
  if (alphabet.indexOf(key) !== -1) {
    // the key is a letter in the alphabet
    if (guessedLetters.indexOf(key) === -1) {
      // the key has not been guessed
      guessedLetters.push(key);
      var string = guessedLetters.join(''); // join the letters together to one single string
      outputElement.text(string);
    }
  }
});


var paragraph = document.getElementById("demo").innerHTML = "The word you are looking for has " + gamewordLength + " characters, can you guess it?";
var paragraph1 = document.getElementById("blanks").innerHTML =  "Word:"+blanks;
var pLives = document.getElementById("pLives").innerHTML = " Lives: " + lives;

document.onkeyup = function(event){
      userInput = event.key;
      userInput = userInput.toUpperCase();

      console.log("the userInput is " + userInput) // 
      
  

    var index = gameWord.indexOf(userInput);

        if (index >= 0) { 
        for (var i = 0; i < gamewordLength; i++){
        console.log("Here is the gamword from within the loop:" + " "+ blanks); 
        var index = gameWord.indexOf(userInput,i); // indexOf checks whether a character is within a string, if the character exists the return value is >=0
        console.log(index);
      	console.log("that works, the right position is " +index);
		blanks = blanks.split('');
		blanks[index*2+1] = userInput; 
		blanks = blanks.join('');
		console.log("here are the new blanks:" + " "+ blanks);
		var paragraph1 = document.getElementById("blanks").innerHTML =  "Word:"+blanks;
				
	}}


	 else {  
	// deducting lives if indexOf === -1, as the user selected character does not exist in the string
		lives = lives -1;
		console.log("lives = " +lives)
		var pLives = document.getElementById("pLives").innerHTML = " Lives: " + lives;
	}


	if (lives === 0){
		var gameOver = document.getElementById("gameOver").innerHTML = " GameOver - refresh the site to play again!";
		}
	
				
	else if (blanks === winword) {
		var winner = document.getElementById("winner").innerHTML = "Well done, you guessed the right word!!";
	}

}}

＆＃13;

<!DOCTYPE html>
<html>
<head>
	<title>Hangman Game</title>
	<link rel="stylesheet" href="assets/css/style.css">
	  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>


</head>
<body>

<h1>Hangman</h1>
<p id="demo"></p> 
  <!-- Js includes the following text: The word you are looking for has " + gamewordLength + " characters, can you guess it?"; -->
 <h1 id="blanks"></h1> <!-- If word is "Love", there will be 4 - - - -  -->
 <h1 id="pLives"></h1> <!-- Lives:  -->
 <h1 id="gameOver"></h1> <!-- GameOver -->
 <h1 id="winner"></h1> <!--Winner -->
 <h3>You already used the following letters:</h3>
 <h3 id="guessed-letters"></h3> <!--Displays used letters -->

<!-- <div id="display"></div>
  <div id="buttons"></div>
  <div id="AllKeys">
  <button id="allButtons">A</button> -->

 </div>

<script src="assets/javascript/game.js"></script>

</body>
</html>

＆＃13;

Answer 1

我没有查看整个代码，但我确实看到你在循环中添加了事件监听器。这意味着将会有重复的侦听器绑定，这可能不是您想要的。

第二个while (j < gamewordLength) {循环终止于代码的底部。好像它应该早点关闭。

var j = 0;  // Creates the blanks i.e. Flower has 6 characters and needs 6 blanks _ _ _ _ _ _
while (j < gamewordLength) {

    winword += " "+ gameWord.charAt(j);
    j++;


//} <----- should be closed here?


alphabet = 'abcdefghijklmnopqrstuvwxyz'.split('');
outputElement = $('#guessed-letters');


$(document).on('keyup', function (event) {
  // ...and so on...

因此，这可能会导致每个事件多次调用您的处理程序，具体取决于gamewordLength的值。

Answer 2

我想我想出来了

1st）我使用了spanky的推荐。

2）我改变了第一个else语句

来自

else {  
// deducting lives if indexOf === -1, as the user selected character does 
not exist in the string
    lives = lives -1;
    console.log("lives = " +lives)
    var pLives = document.getElementById("pLives").innerHTML = " Lives: " + 
lives;

到

else if { index < 0 && lives >0 ){  
// deducting lives if indexOf === -1, as the user selected character does 
not exist in the string
    lives = lives -1;
    console.log("lives = " +lives)
    var pLives = document.getElementById("pLives").innerHTML = " Lives: " + 
lives;

））

这就是诀窍。您可以在github

上找到更新的版本

谢谢你们 - 这真的很有帮助

刽子手游戏 - 不能让循环停止扣除生命 - 否则就会起作用

2 个答案: