Changing Javascript variable using HTML buttons [duplicate]

Question

I'm building a Rock, Paper, Scissors game using JavaScript and HTML. I made the game work in the console, and now I'm just adding a UI to it. I'm having an issue setting the playerChoice variable using HTML buttons (I was using a prompt before, but that's not very user-friendly).

What I've tried doing is making a function that is supposed to set playerChoice to whatever button is clicked. I set the onClick method for my buttons to run this function, and use the button's value as an input parameter. However, I'm getting "input not defined errors" when I test this.

let playerChoice = ""
function setPlayerChoice(choice){
    playerChoice = choice;
}

<button class="button" id="btnRock" onClick=setPlayerChoice("rock")>Rock</button>
<button class="button" id="btnPaper" onClick=setPlayerChoice("rock")>Paper</button>
<button class="button" id="btnScissors" onClick=setPlayerChoice("scissors")>Scissors</button>

Nidhin Joseph · Accepted Answer · 2019-08-12 02:49:03Z

1

Try this.

let playerChoice = ""

function setPlayerChoice(choice) {
  playerChoice = choice;
  console.log(playerChoice);
}

<button class="button" id="btnRock" onClick="setPlayerChoice('rock')">Rock</button>
<button class="button" id="btnPaper" onClick="setPlayerChoice('paper')">Paper</button>
<button class="button" id="btnScissors" onClick="setPlayerChoice('scissors')">Scissors</button>

answered Aug 12, 2019 at 2:49

Nidhin Joseph

10.3k4 gold badges28 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Thiago Valente · Accepted Answer · 2019-08-12 02:50:49Z

0

HTML

<button class="button" id="btnRock" onClick=setPlayerChoice("rock")>Rock</button>
<button class="button" id="btnRock" onClick=setPlayerChoice("paper")>Paper</button>
<button class="button" id="btnRock" onClick=setPlayerChoice("scissors")>Scissors </button>

Javascript

var playerChoice = "";
function setPlayerChoice(choice) {
  playerChoice = choice;
}

answered Aug 12, 2019 at 2:50

Thiago Valente

7039 silver badges28 bronze badges

Collectives™ on Stack Overflow

Changing Javascript variable using HTML buttons [duplicate]

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related