ボタンをクリックしても、なぜか何も起こりません。plater1Dice 要素に乱数を挿入する必要があるという事実にもかかわらず。しかし、ページを再読み込みすると、ボタンの作業と新しい番号の挿入が行われます!
HTML:
<html>
<head>
<link rel="stylesheet" href="test.css">
</head>
<body>
<div class="container">
<h1 id="message">Player 1 Turn</h1>
<div class="players">
<div id="player1">
<h1>Score:
<span id="player1Scoreboard">0</span>
</h1>
<div id="player1Dice" class="dice active">-</div>
</div>
<div id="player2">
<h1>Score:
<span id="player2Scoreboard">0</span>
</h1>
<div id="player2Dice" class="dice">-</div>
</div>
</div>
<button id="rollBtn">Roll Dice </button>
<button id="resetBtn">Reset Game </button>
</div>
<script src="test.js"></script>
</body>
</html>
JS
let player1Dice = document.getElementById("player1Dice");
let rollBtn = document.getElementById("rollBtn")
function randomNum() {
const num = Math.floor(Math.random()*6)+1
player1Dice.textContent = num
}
rollBtn.addEventListener("click",randomNum())
編集:私は自分で解決策を見つけて書き留めました
将来この種の問題に遭遇する人のために、私は解決策を見つけました!
()
addeventlistener 関数からを削除する必要があります! ではなく("click", randomNum())
、 である必要があります("click", randomNum)
。