#Need some help with a Hangman game function not updating with correct letters

3 messages · Page 1 of 1 (latest)

hidden escarp
#

Here is the accompanying HTML:

<html lang="en">
<head>
    <title>Hangman Game</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h1 id="header">Hangman Game</h1>
    <div id="buttonDiv">
        <button value="A" onclick="checkButton(event)">A</button>
        <button value="B" onclick="checkButton(event)">B</button>
        <button value="C" onclick="checkButton(event)">C</button>
        <button value="D" onclick="checkButton(event)">D</button>
        <button value="E" onclick="checkButton(event)">E</button>
        <button value="F" onclick="checkButton(event)">F</button>
        <button value="G" onclick="checkButton(event)">G</button>
        <button value="H" onclick="checkButton(event)">H</button>
        <button value="I" onclick="checkButton(event)">I</button>
        <button value="J" 

^(and so on until Z)

    </div>

    <div>
        <p id="fields"></p>
    </div>

    <div>
        <p id="feedback"></p>
    </div>

    <div>
        <button id="startButton" onclick="onStartClick()">Start Game</button>
    </div>

<script src="script.js"></script>
</body>
</html>```
neon tundra
#

hello please try this one

# 
let guessedLetters = [];
let maxAttempts = 6;
let currentAttempts = 0;

function onStartClick() {
    const words = ["JAVASCRIPT", "PROGRAMMING", "HANGMAN", "DEVELOPER"];
    wordToGuess = words[Math.floor(Math.random() * words.length)];
    guessedLetters = [];
    currentAttempts = 0;
    document.getElementById("feedback").textContent = "";
    updateFields();
    document.getElementById("header").textContent = "Hangman Game - Guess a Letter!";
}

function checkButton(event) {
    const letter = event.target.value;
    if (!guessedLetters.includes(letter)) {
        guessedLetters.push(letter);
        if (!wordToGuess.includes(letter)) {
            currentAttempts++;
            if (currentAttempts >= maxAttempts) {
                document.getElementById("feedback").textContent = "Game Over! The word was: " + wordToGuess;
                disableButtons();
            }
        }
    }
    updateFields();
}

function updateFields() {
    let displayWord = wordToGuess.split('').map(letter => guessedLetters.includes(letter) ? letter : "_").join(' ');
    document.getElementById("fields").textContent = displayWord;

    if (!displayWord.includes("_")) {
        document.getElementById("feedback").textContent = "Congratulations! You guessed the word!";
        disableButtons();
    }
}

function disableButtons() {
    const buttons = document.getElementById("buttonDiv").getElementsByTagName("button");
    for (let button of buttons) {
        button.disabled = true;
    }
}