使用 HTML 按钮更改 Javascript 变量 [重复]答案

【问题标题】：Changing Javascript variable using HTML buttons [duplicate]使用 HTML 按钮更改 Javascript 变量 [重复]
【发布时间】：2019-08-12 02:43:22
【问题描述】：

我正在使用 JavaScript 和 HTML 构建一个石头剪刀布游戏。我让游戏在控制台中运行，现在我只是给它添加一个 UI。我在使用 HTML 按钮设置 playerChoice 变量时遇到问题（我之前使用过提示，但这对用户不太友好）。

我尝试做的是创建一个函数，应该将playerChoice 设置为单击的任何按钮。我为我的按钮设置了onClick 方法来运行此功能，并使用按钮的值作为输入参数。但是，当我测试这个时，我得到了“输入未定义的错误”。

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>

【问题讨论】：

标签： javascript html button

【解决方案1】：

试试这个。

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>

【讨论】：

【解决方案2】：

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;
}

【讨论】：