该游戏运行正常,只不过得分不会增加并且我的“裁判员”框未显示基于结果分配给我的文本。
我使用了if else语句来随机分配计算机选择并替换图像,并相应地设置computerChoice变量。我为用户输入使用了if ife语句来分配正确的图像并设置userChoice变量。然后,我使用一组单独的if else语句嵌套来比较computerCoice和userChoice变量,并在裁判框中输出文本,并将广告1指向获胜者得分框,但这部分不起作用。有任何想法吗?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Rock, Paper, Scissors!</title>
<style>
.clear {clear: both;}
.box {width: 160px; height: 150px; float: left; border: 4px solid #000;}
.wrap {width: 110px; float: left;}
.wrap input {width: 85px;}
form {width: 340px; margin: 20px auto 0 auto;}
</style>
<script>
var referee = document.getElementById('ref').value;
var userScore = document.getElementById('userScore').value;
var computerScore = document.getElementById('compScore').value;
userScore = 0;
computerScore = 0;
function startGame() {
var computerChoice = Math.random();
if (computerChoice >= 0 && computerChoice <= .33) {
computerChoice = "rock"
document.getElementById("compPic").src = "rock.jpg";
} else if (computerChoice >= .34 && computerChoice <= .66) {
computerChoice = "paper"
document.getElementById("compPic").src = "paper.jpg";
}else if (computerChoice >= .67 && computerChoice <= 1){
computerChoice = "scissors"
document.getElementById("compPic").src = "scissors.jpg";
};
var userChoice = document.getElementById('userChoice').value;
if (userChoice === "rock" || userChoice === "Rock") {
userChoice = "rock";
document.getElementById("userPic").src = "rock.jpg";
} else if (userChoice === "paper" || userChoice === "Paper") {
userChoice = "paper";
document.getElementById("userPic").src = "paper.jpg";
} else if (userChoice === "scissors" || userChoice === "Scissors") {
userChoice = "scissors";
document.getElementById("userPic").src = "scissors.jpg";
};
if (userChoice === computerChoice) {
referee = "Tie!";
}else if (userChoice === 'rock') {
if (computerChoice === 'paper') {
referee = 'Computer Wins!';
computerScore = ++computerScore;
} else if (computerChoice === 'scissors') {
referee = 'You Wins!';
userScore = ++userScore;
};
}else if (userChoice === 'paper') {
if (computerChoice === 'scissors') {
referee = 'Computer Wins!';
computerScore = ++computerScore;
} else if (computerChoice === 'rock') {
referee = 'You Wins!';
userScore = ++userScore;
};
}else if (userChoice === 'scissors') {
if (computerChoice === 'rock') {
referee = 'Computer Wins!';
computerScore = ++computerScore;
} else if (computerChoice === 'paper') {
referee = 'You Wins!';
userScore = ++userScore;
};
};
}
</script>
</head>
<body>
<form>
<div class="box"><img id="userPic" src="rps.jpg"></div>
<div class="box"><img id="compPic" src="rps.jpg"></div>
<br class="clear"><br>
<div class="wrap">
<label for="userScore">User Score:</label><br>
<input type="text" name="userScore" id="userScore" value="" readonly>
</div>
<div class="wrap">
<label for="ref">Referee:</label><br>
<input type="text" name="ref" id="ref" placeholder="Referee's Call..." value="" readonly>
</div>
<div class="wrap">
<label for="compScore">Computer Score:</label><br>
<input type="text" name="compScore" id="compScore" value="" readonly>
</div>
<br class="clear"><br>
<label for="userChoice">Choose Your Weapon:</label><br>
<input type="text" name="userChoice" id="userChoice" placeholder="Rock, Paper, or Scissors?">
<input type="button" value="Battle!" onclick="startGame()">
</form>
</body>
</html>
您必须将用户评分右移至用户评分输入字段。其次,您的得分将在每个游戏上重置。.它不具有可交换性。.我不希望您因可交换性而错过它或它被错过。.define userScore = 0; computerScore = 0; 在函数定义之前。
试试这个
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Rock, Paper, Scissors!</title>
<style>
.clear {clear: both;}
.box {width: 160px; height: 150px; float: left; border: 4px solid #000;}
.wrap {width: 110px; float: left;}
.wrap input {width: 85px;}
form {width: 340px; margin: 20px auto 0 auto;}
</style>
<script>
//var referee = document.getElementById('ref').value;
//var userScore = document.getElementById('userScore').value;
//var computerScore = document.getElementById('compScore').value;
userScore = 0;
computerScore = 0;
function startGame() {
var computerChoice = Math.random();
if (computerChoice >= 0 && computerChoice <= .33) {
computerChoice = "rock"
//document.getElementById("compPic").src = "rock.jpg";
} else if (computerChoice >= .34 && computerChoice <= .66) {
computerChoice = "paper"
//document.getElementById("compPic").src = "paper.jpg";
}else if (computerChoice >= .67 && computerChoice <= 1){
computerChoice = "scissors"
//document.getElementById("compPic").src = "scissors.jpg";
};
var userChoice = document.getElementById('userChoice').value;
if (userChoice === "rock" || userChoice === "Rock") {
userChoice = "rock";
//document.getElementById("userPic").src = "rock.jpg";
} else if (userChoice === "paper" || userChoice === "Paper") {
userChoice = "paper";
// document.getElementById("userPic").src = "paper.jpg";
} else if (userChoice === "scissors" || userChoice === "Scissors") {
userChoice = "scissors";
// document.getElementById("userPic").src = "scissors.jpg";
};
if (userChoice === computerChoice) {
referee = "Tie!";
}else if (userChoice === 'rock') {
if (computerChoice === 'paper') {
referee = 'Computer Wins!';
computerScore = ++computerScore;
} else if (computerChoice === 'scissors') {
referee = 'You Wins!';
userScore = ++userScore;
};
}else if (userChoice === 'paper') {
if (computerChoice === 'scissors') {
referee = 'Computer Wins!';
computerScore = ++computerScore;
} else if (computerChoice === 'rock') {
referee = 'You Wins!';
userScore = ++userScore;
};
}else if (userChoice === 'scissors') {
if (computerChoice === 'rock') {
referee = 'Computer Wins!';
computerScore = ++computerScore;
} else if (computerChoice === 'paper') {
referee = 'You Wins!';
userScore = ++userScore;
};
};
document.getElementById('ref').value = referee;
document.getElementById('userScore').value = userScore;
document.getElementById('compScore').value =computerScore;
}
</script>
</head>
<body>
<form>
<div class="box"><img id="userPic" src="rps.jpg"></div>
<div class="box"><img id="compPic" src="rps.jpg"></div>
<br class="clear"><br>
<div class="wrap">
<label for="userScore">User Score:</label><br>
<input type="text" name="userScore" id="userScore" value="" readonly>
</div>
<div class="wrap">
<label for="ref">Referee:</label><br>
<input type="text" name="ref" id="ref" placeholder="Referee's Call..." value="" readonly>
</div>
<div class="wrap">
<label for="compScore">Computer Score:</label><br>
<input type="text" name="compScore" id="compScore" value="" readonly>
</div>
<br class="clear"><br>
<label for="userChoice">Choose Your Weapon:</label><br>
<input type="text" name="userChoice" id="userChoice" placeholder="Rock, Paper, or Scissors?">
<input type="button" value="Battle!" onclick="startGame()">
</form>
</body>
</html>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句