CODEWITHSUNDEEP
javascripthtmlgetelementbyid
Anthony
Anthony

Reputation: 47

letter guessing game in javascript

I can't figure out what I'm doing wrong here. I can't get any on the values(wins, losses etc) to update on my page. all of my Id have been set up correctly in my HTML as well. Any help would be greatly appreciated!

var alphabet = ['a','b','c','d','e','f','g','h','i','j','k','l',
    'm','n','o','p','q','r','s','t','u','v','w','x','y','z'];

// Variables for tracking our wins, losses and ties. They begin at 0.
var wins = 0;
var losses = 0;
var guesses = 10;

    var computerChoice = alphabet[Math.floor(Math.random() * alphabet.length)];

    console.log(computerChoice)



   // When the user presses a key, it will run the following function...
document.onkeypress = function(event) {
    var userGuess = event.key;

    if(userGuess === computerChoice){
        wins++;
    }else{
        guesses--;
    }

    if(guesses = 0){
        losses++
    }
}   
    document.getElementById('wins').innerHTML = "Wins: " + wins;
    document.getElementById('losses').innerHTML = "losses: " + losses;
    document.getElementById('guesses').innerHTML = "Guesses left: " + guesses;

Upvotes: 0

Views: 5910

Answers (1)

gavgrif
gavgrif

Reputation: 15509

You are closing the onkeypress function before updating the innerHTML and so they would not be updated on each keypress. I have moved the closing brace to below the html update portion - see if that works.

I also changed the assignment operator in the last if statment to a strict equality comparison operator so that the guesses count can be compared to 0.

document.onkeypress = function(event) {
    var userGuess = event.key;

    if(userGuess === computerChoice){
        wins++;
    }else{
        guesses--;
    }

    if(guesses === 0){
        losses++
    }

    document.getElementById('wins').innerHTML = "Wins: " + wins;
    document.getElementById('losses').innerHTML = "losses: " + losses;
    document.getElementById('guesses').innerHTML = "Guesses left: " + guesses;

}  // moved to below the innerHTML update

Upvotes: 1

Related Questions