我是一个很新的编程人员，我正在尝试使用Javascript制作岩石剪刀，我遇到了这个问题。每当我点击岩石图像，它会产生一个0和2之间的随机数，如果这个数字是0，那就是平局，如果是1，那玩家输了，如果是2，那玩家赢了。但当我运行这段代码时，它只在数字为0时才起作用。所以当我点击按钮时，如果数字是0，它会显示“它是一个领带”，但如果不是0，它不会显示任何东西。但当我再次尝试单击时，它不起作用。我必须刷新页面才能再试一次。有人能帮帮我吗，对不起，如果我没有好好解释这件事。
HTML：
<html>
<head>
<link rel="stylesheet" href="style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Ubuntu&display=swap" rel="stylesheet">
</head>
<title> Rock Paper Scissors! </title>
<body>
<div id="rpsGame">
<h1 id="RPS"> Rock, paper, scissors! </h1>
<div id="score">
<p id="myScore">0</p>
<p>:</p>
<p id="botScore">0</p>
</div>
<img src="rock.png" id="rock">
<img src="paper.png" id="paper">
<img src="scissors.png" id="scissors">
<p id="winOrLose"></p>
</div>
</body>
</html>
JavaScript：
var randomNumber = Math.floor(Math.random() * 3)
var rockChoice = document.getElementById('rock');
var botAnswer = document.getElementById('winOrLose')
rockChoice.addEventListener('click', function() {
if (randomNumber == 0) {
botAnswer.textContent = "Bot picked rock, you tie!"
if (randomNumber == 1) {
botAnswer.textContent = "Bot picked paper, you lose!"
if (randomNumber == 2) {
botAnswer.textContent = "Bot picked scissors, you lose!"
}
}
}
});
CSS：
body {
background-color:#2a303d;
text-align: center;
font-family: 'Ubuntu', sans-serif;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}
#rock {
width: 80%;
position: absolute;
top: 45.8%;
left: 39.75%;
transform: translate(-50%, -50%);
transform: rotate(360deg);
height: 100px;
width: 100px
}
#paper {
width: 80%;
position: absolute;
top: 45.8%;
left: 46.75%;
transform: translate(-50%, -50%);
transform: rotate(360deg);
height: 100px;
width: 100px;
}
#scissors {
width: 80%;
position: absolute;
top: 52.05%;
left: 57.25%;
transform: translate(-50%, -50%);
height: 100px;
width: 100px;
}
#RPS {
font-size: 65px;
margin-top: 40px;
}
#botPick {
font-size: 50px;
margin-top: 350px;
}
#Score p {
margin:0;
padding:0;
margin-left: 5px;
font-size: 36px;
display: inline-block;
line-height: 80px;
vertical-align: top;
}
#winOrLose {
color: white;
}
在EventListener中移动随机数声明（单击）
尝试使用这个固定的Js代码
var rockChoice = document.getElementById('rock');
var botAnswer = document.getElementById('winOrLose')
rockChoice.addEventListener('click', function() {
var randomNumber = Math.floor(Math.random() * 3)
if (randomNumber == 0) {
botAnswer.textContent = "Bot picked rock, you tie!"
if (randomNumber == 1) {
botAnswer.textContent = "Bot picked paper, you lose!"
if (randomNumber == 2) {
botAnswer.textContent = "Bot picked scissors, you lose!"
}
}
}
});
