Question

我正在使用HTML5和JavaScript构建一个骰子游戏。

我希望玩家能够通过onlclick选择骰子。这将阻止掷骰子。玩家应该能够再次点击骰子按钮，这将允许骰子再次滚动。

我玩过代码和第一个onclick工作，但第二个onclick没有。

这是每个输入按钮一个onclick的限制，还是我应该使用输入按钮以外的其他HTML标记？

我希望在不重新加载屏幕的情况下播放游戏。

HTML5

<tr>
<th><input type="button" id="diceOne" onclick="selectDice(this.id,this.value)" value="0"></input></th>

<th><input type="button" id="diceTwo" onclick="selectDice(this.id,this.value)" value="1"></input></th>

<th><input type="button" id="diceThree" onclick="selectDice(this.id,this.value)" value="2"></input></th>

<th><input type="button" id="diceFour" onclick="selectDice(this.id,this.value)" value="3"></input></th>

<th><input type="button" id="diceFive" onclick="selectDice(this.id,this.value)" value="4"></input></th>
</tr>

的Javascript

function selectDice(diceName,diceValue){
if (diceArray[diceValue][1]=="y"){
    alert(diceArray[diceValue][1]);
    document.getElementById(diceName).value = "Die now selected";
    diceArray[diceValue][1]="n";
    alert(diceArray[diceValue][1]); 
} 
else {
    alert(diceArray[diceValue][1]); 
    document.getElementById(diceName).value = "Die not selected";
    diceArray[diceValue][1]="y";
    alert(diceArray[diceValue][1]); 
}

}

Answer 1

您的代码中可能存在错误。我认为这是正在发生的事情：

您点击第一个骰子，这会导致调用selectDice，传入diceName的id和diceValue的值;或者分别是“diceOne”和“0”。
在if语句的任何路径中，你执行一个document.getElementById（diceName），它将获取你点击的输入元素（所以在这种情况下，是第一个输入元素），并更改值“现在选择死亡”或“未选择死亡”。这就是一切都出错的地方。
下次点击该模具时，它会调用selectDice，并再次输入diceName的id和diceValue的值...除此时，diceName为“diceOne”，diceValue为“Die now selected” 。由于diceArray对象中的索引“Die now selected”没有值，所以一切都从这里开始走下坡路。

我建议在没有“document.getElementById（diceName）.value = ...”行的情况下尝试此代码，然后查看它是否有效。如果你真的需要在你的onclick中更改输入元素的值，那么我建议不要使用内联onclick，或者传递你想要的diceName和diceValue的文字值，如下所示：

<input type="button" id="diceOne" onclick="selectDice('diceOne','0')" value="0"></input>

Answer 2

为每个按钮创建变量，并为javascript中的每次点击触发它们为true / false作为条件，并且应该修复您的第二次点击;）

在HTML5中多次单击“输入”按钮

HTML5

的Javascript

2 个答案: