2 玩家 Javascript 刽子手游戏问题有提示

Question

I am currently making a hangman game, 1st player need to enter a word the player 2 need to guess via a prompt.我目前正在制作一个刽子手游戏，第一个玩家需要输入一个玩家 2 需要通过提示猜测的单词。 When i enter the word via the prompt it's in the console log but it's not showing in the page.当我通过提示输入单词时，它在控制台日志中，但没有显示在页面中。 It is suppose to be show in underslash like: '_ _ _ _ _' depending on the length of the word.它应该以下斜线显示，例如：'_ _ _ _ _'，具体取决于单词的长度。 How do I get to show the word in underslash form?如何以下斜线形式显示单词？

Here is what I have so far.这是我到目前为止所拥有的。

Thanks!谢谢！

HTML: HTML：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">


    <title>Hangman</title>
</head>

<body>
    <div class="container">
        <h1>Hangman</h1>
        <div>Wrong Guesses: <span id='mistakes'>0</span> of <span id='maxWrong'></span></div>
        <div>
            <img id='hangmanPic' src="./images/0.jpg" alt="">
            <p>Guess the word:</p>
            <p id="wordSpotlight">The word to be guessed goes here</p>
            <div id="keyboard"></div>
            <button class="btn btn-info" onClick="reset()">Reset</button>
        </div>
    </div>
</body>

</html>

Script:脚本：

<script>
        let answer = '';
        let maxWrong = 8;
        let mistakes = 0;
        let guessed = [];
        let wordStatus = null;

        function randomWord() {
            var secretWord = prompt("Player 1, enter a word to guess", "");
            secretWord = secretWord.toUpperCase();
            console.log("Word to guess: " + secretWord);

            var secretWordArray = Array.from(secretWord);
            console.log("Word to guess (array): " + secretWordArray);

            var wordArray = [];
            for (var i = 0; i < secretWordArray.length; i++) {
                motArray[i] = " _ ";
            }
            return wordArray;
        }

        function generateButtons() {
            let buttonsHTML = 'abcdefghijklmnopqrstuvwxyz'.split('').map(letter =>
                `<button class="btn btn-lg btn-primary m-2" id='` + letter + `'onClick="chooseLetter('` + letter + `')">` + letter + `</button>`).join('');

            document.getElementById('keyboard').innerHTML = buttonsHTML;
        }

        function chooseLetter(chosenLetter) {
            guessed.indexOf(chosenLetter) === -1 ? guessed.push(chosenLetter) : null;
            document.getElementById(chosenLetter).setAttribute('disabled', true);

            if (answer.indexOf(chosenLetter) >= 0) {
                guessedWord();
                checkIfGameWon();
            } else if (answer.indexOf(chosenLetter) === -1) {
                mistakes++;
                updateMistakes();
                checkIfGameLost();
                updateHangmanPicture();
            }
        }

        function updateHangmanPicture() {
            document.getElementById('hangmanPic').src = './images/' + mistakes + '.jpg';
        }

        function checkIfGameWon() {
            if (wordStatus === answer) {
                document.getElementById('keyboard').innerHTML = 'You Won!!!';
            }
        }

        function checkIfGameLost() {
            if (mistakes === maxWrong) {
                document.getElementById('wordSpotlight').innerHTML = 'The answer was: ' + answer;
                document.getElementById('keyboard').innerHTML = 'You Lost!!!';
            }
        }

        function guessedWord() {
            wordStatus = answer.split('').map(letter => (guessed.indexOf(letter) >= 0 ? letter : " _ ")).join('');

            document.getElementById('wordSpotlight').innerHTML = wordStatus;
        }

        function updateMistakes() {
            document.getElementById('mistakes').innerHTML = mistakes;
        }

        function reset() {
            mistakes = 0;
            guessed = [];
            document.getElementById('hangmanPic').src = './images/0.jpg';

            randomWord();
            guessedWord();
            updateMistakes();
            generateButtons();
        }

        document.getElementById('maxWrong').innerHTML = maxWrong;

        randomWord();
        generateButtons();
        guessedWord();
    </script>

Answer 1

Using a for loop, iterate over the secret word character by character, and check if it's in the guessed array.使用for循环，逐个字符地遍历秘密单词，并检查它是否在guessed的数组中。 If it is, output the character followed by a space.如果是，则 output 该字符后跟一个空格。 If not, output an underscore followed by a space.如果不是，output 一个下划线后跟一个空格。

If there are no guessed letters this will output a row of underscores.如果没有猜到的字母这将 output 一行下划线。

Watch for issues with upper and lower case.注意大小写的问题。

 let output = ''; let secret = "secret"; let guessed = ['e', 't']; for (let char of secret) { output += ((guessed.indexOf(char) === -1)?'_':char)+" "; } output = output.trim(); console.log(output); // _ e _ _ et

2 玩家 Javascript 刽子手游戏问题有提示

问题描述

1 个解决方案

解决方案1
1 2021-04-27 00:59:30

2 玩家 Javascript 刽子手游戏问题有提示

问题描述

1 个解决方案

解决方案1 1 2021-04-27 00:59:30

解决方案1
1 2021-04-27 00:59:30