我对编程比较新,所以请原谅我的代码。目标是创建一个简单的骰子游戏,其中Javascript中有两个玩家。我的问题是,当骰子滚动时,我似乎可以弄清楚如何正确地将两个骰子掷骰的总和添加到每个玩家的得分中。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>Andrews awesome dice game</title>
<script src="diceGame.js"></script>
<link rel="stylesheet" type="text/css" href="diceGame.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
</head>
<body>
<h1 id="gameTitle" class="col-lg-12">The Dice Game</h1>
<div id="die1" class="dice">0</div>
<div id="die2" class="dice">0</div>
<div class="col-lg-12 playerScore">
<h2>PLAYER 1:</h2>
<h2 id="player1Score"></h2>
<h2>PLAYER 2:</h2>
<h2 id="player2Score"></h2>
<button onclick="rollDice()" id="rollBtn">Roll Dice</button>
<h2 id="status" style="clear:left;"></h2>
</body>
</html>
继承人Javascipt:
//global variables
//Players
var player1 = prompt("what is your name, player 1?");
var player2 = prompt("What is your name, player 2?");
var rollButton = document.getElementById("rollBtn");
var win = 50;
function rollDice(){
var die1 = document.getElementById("die1");
var die2 = document.getElementById("die2");
var status = document.getElementById("status");
var p1Score = document.getElementById("player1Score");
var p2Score = document.getElementById("player2Score");
var score1 = 0;
var score2 = 0;
var moves = 0;
var d1 = Math.floor(Math.random() * 6) + 1;
var d2 = Math.floor(Math.random() * 6) + 1;
var moves = 1;
var diceTotal = d1 + d2;
die1.innerHTML = d1;
die2.innerHTML = d2;
status.innerHTML = "You rolled "+diceTotal+".";
if (moves == 1) {
if (d1 == 1 && d2 == 1) { // if both dice equal 1, set the score to equal 0
diceTotal = 0;
moves++;
score1 = score1 + diceTotal;
p1Score.innerHTML += score1;
status.innerHTML += " Your score has been reset to zero";
} else {
if(d1 == d2) { //if both dice are the same, double the players score
diceTotal = diceTotal*2;
moves++;
score1 = score1 + diceTotal;
p1Score.innerHTML += score1;
status.innerHTML += " Lucky! your total has been doubled to "+(diceTotal)+".";
} else{
moves++;
score1 = score1 + diceTotal;
p1Score.innerHTML += score1;
status.innerHTML += " Your Turn "+player2+".";
console.log(score1);
}
}
} else {
if (d1 == 1 && d2 == 1) { // if both dice equal 1, set the score to equal 0
diceTotal = 0;
moves++;
score2 = score2 + diceTotal;
p2Score.innerHTML += score2;
status.innerHTML += player2+" score has been reset to zero";
} else {
if(d1 == d2) { //if both dice are the same, double the players score
diceTotal = diceTotal*2;
moves++;
score2 = score2 + diceTotal;
p2Score.innerHTML += score2;
status.innerHTML += " Lucky! your total has been doubled to "+(diceTotal)+".";
} else{
moves++;
score2 = score2 + diceTotal;
p2Score.innerHTML += score2;
status.innerHTML += " Your Turn "+player1+".";
}
}
}
}
请原谅我粗鄙的逻辑。我还很新。欢迎任何提示,代码建议或建议
答案 0 :(得分:0)
我在这里猜测,因为你没有包含代码正在生成的实际结果(除了预期结果之外的好地方 em>),但这些行在这里:
score1 = score1 + diceTotal;
p1Score.innerHTML += score1;
首先,p1Score.innerHTML
是一个字符串。如果您使用+
运算符添加到字符串,javascript
将连接值,而不是 sum ,即"1" + 1 = "11"
< / p>
其次,您已经增加了score1
变量的值。为什么要再次添加该值?
尝试设置innerHTML
:
p1Score.innerHTML = score1;