学生试图找出javaScript代码的石头剪刀布蜥蜴史波克
Student trying to figure out javaScript Code for Rocks Paper Scissors Lizard Spock
嗨stackoverflow社区-我正试图得到其他人对我的编码结构的想法。我是新手,只是想更好地理解javaScript是如何工作的。
对于这段代码,我有一些麻烦,试图在浏览器上指出赢家。我得到我的选择,电脑的选择,但不告诉谁是赢家。任何帮助都非常感谢!
$(document).ready(function() {
var choice = ''; //displays what the user picks
var computer = ''; //displays what the computer picks
var computerPick = ''; //
//user pick
$('.userCards').click(function() {
choice = $(this).attr("id");
computer = computerChoice();
$('.userSelect').text(choice);
$('.compSelect').text(computer);
});
$("#clear").click(function() {
window.location.reload();
}); //button refreshes screen
});
var compare = '';
var roundScore = '';
var whoWins = '';
var compare1 = '';
var choice1 = '';
var choice2 = '';
function computerChoice() {
computerPick = Math.random();
if (computerPick < 0.2) {
computerPick = "rock";
} else if (computerPick <= 0.4) {
computerPick = "paper";
} else if (computerPick <= 0.6) {
computerPick = "scissors";
} else if (computerPick <= 0.8) {
computerPick = "lizard";
} else {
computerPick = "spock";
}
return computerPick;
console.log(computerPick);
} // end of choice function
function compareRound() {
if (choice1 === choice2) {
return "The result is a tie!";
}
if (choice1 === "rock") {
if (choice2 === "scissors") {
return "rock wins";
} else {
return "paper wins";
}
} else if (choice1 === "paper") {
if (choice2 === "rock") {
return "paper wins";
} else {
return "scissors wins";
}
} else if (choice1 === "scissors") {
if (choice2 === "rock") {
return "rock wins";
} else {
return "scissors win";
}
} else if (choice1 === "lizard") {
if (choice2 === "paper") {
return "lizard wins";
} else {
return "rock win";
}
} else if (choice1 === "spock") {
if (choice2 === "scissors") {
return "spock wins";
} else {
return "lizard win";
}
}
document.getElementById(".roundScore").innerHTML = compareRound;
}
+++++++++++++++ 下面的HTML代码 ++++++++++
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Rock - Paper - Scissors - Lizard - Spock</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<script src="js/scripts-3.10.0.js"></script>
<script src="js/script.js"></script>
<noscript>Please turn on JavaScript to utilize this site</noscript>
</head>
<body>
<div class="container">
<header>
<h1>* Welcome to RPSLS *</h1>
<h3>- rock | paper | scissors | lizard | spock - </h3>
</header>
<hr>
<div id = "cardSection" class = "userbox">
<nav>
<input id="rock" class="userCards" type="image" src="img/WEB/rockUser.jpg" alt="Submit">
<input id="paper" class="userCards" type="image" src="img/WEB/paperUser.jpg" alt="Submit">
<input id="scissors" class="userCards" type="image" src="img/WEB/scissorsUser.jpg" alt="Submit">
<input id="lizard" class="userCards" type="image" src="img/WEB/lizardUser.jpg" alt="Submit">
<input id="spock" class="userCards" type="image" src="img/WEB/spockUser.jpg" alt="Submit">
</nav>
</div>
<div id="score">
<p class="userS">
<label>User Choice: <span class="userSelect"></span></label>
<span id="userScore"></span>
</p>
<br>
<p class="compS">
<label>Computer Choice: <span class="compSelect"></span></label>
<span id="computerScore"></span>
</p>
<br>
<hr>
<br>
<p class="gameResult">
<label>This Rounds Winner: <span class="roundScore"></span></label>
<span id="gameResult"></span>
</p>
<br>
<p class="totalResult">
<label>The Game Winner:<span class="whoWins"></span></label>]
</p>
</div>
<button id="clear">Start Over</button>
</div>
</body>
只是因为(不是真正的答案)
var rules =
{ rock: { scissors: 'blunts', lizard: 'crushes' }
, paper: { rock: 'covers', spock: 'disproves' }
, scissors:{ paper: 'cuts', lizard: 'decapitates' }
, lizard: { spock: 'poisons', paper: 'eats' }
, spock: { scissors: 'smashes', rock: 'vaporizes' }
};
var actors = Object.keys(rules);
var iterations = 3;
function test() {
for(var i = 0; i < iterations; i++) {
var a = b = actors[Math.floor(Math.random() * actors.length)];
while (b == a) b = actors[Math.floor(Math.random() * actors.length)];
var winner = rules[a][b]? a : b;
var loser = winner == a? b : a;
console.log(winner+" "+rules[winner][loser]+" "+loser);
}
}
document.addEventListener("DOMContentLoaded", test, false);
我在你的代码中发现了一些错误:
- 您正在使用
document.getElementById
,然后选择看起来可能像类的东西。你已经在使用jQuery了,所以你不需要使用普通的JS - 我没有看到
compareRound
被调用的地方,点击按钮。我在下面添加了这样一个函数。
下面是经过上述修改的代码的工作模型
$(document).ready(function() {
var choice = ''; //displays what the user picks
var computer = ''; //displays what the computer picks
var computerPick = ''; //
//user pick
$('.userCards').click(function() {
choice = $(this).attr("id");
computer = computerChoice();
$('.userSelect').text(choice);
$('.compSelect').text(computer);
$(".roundScore").text(compareRound(choice,computer ));
});
});
var compare = '';
var roundScore = '';
var whoWins = '';
var compare1 = '';
var choice1 = ''
var choice2 = '';
function computerChoice() {
computerPick = Math.random();
if (computerPick < 0.2) {
computerPick = "rock";
} else if (computerPick <= 0.4) {
computerPick = "paper";
} else if (computerPick <= 0.6) {
computerPick = "scissors";
} else if (computerPick <= 0.8) {
computerPick = "lizard";
} else {
computerPick = "spock";
}
return computerPick;
console.log(computerPick);
} // end of choice function
function compareRound(choice1, choice2) {
if (choice1 === choice2) {
return "The result is a tie!";
}
if (choice1 === "rock") {
if (choice2 === "scissors") {
return "rock wins";
} else {
return "paper wins";
}
} else if (choice1 === "paper") {
if (choice2 === "rock") {
return "paper wins";
} else {
return "scissors wins";
}
} else if (choice1 === "scissors") {
if (choice2 === "rock") {
return "rock wins";
} else {
return "scissors win";
}
} else if (choice1 === "lizard") {
if (choice2 === "paper") {
return "lizard wins";
} else {
return "rock win";
}
} else if (choice1 === "spock") {
if (choice2 === "scissors") {
return "spock wins";
} else {
return "lizard win";
}
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="userCards" id="rock">Rock</button>
<button class="userCards"id="paper">Paper</button>
<button class="userCards" id="lizard">Lizard</button>
<button class="userCards" id="spock">Spock</button>
<span class="userSelect"></span>
<span class="compSelect"></span>
<span class="roundScore"></span>
我可以读你的代码,你只有一个错误…在这行document.getElementById(".roundScore").innerHTML = compareRound; }
,你说取一个I'd元素…如果它是一个I,你必须改变(".roundScore")为("#roundScore")…如果您想要获取的元素是可以更改document.getElementById(".roundScore")
的类名的引用document.getElementByClassName (roundScore)
. .我希望能帮到你
相关文章:
- 代码学院的石头剪刀布
- 石头剪刀布游戏功能在Javascript
- 石头剪刀布蜥蜴斯波克游戏逻辑偶尔会输出错误的赢家,我不知道为什么
- Javascript中的石头剪刀布
- 尝试为石头剪刀布游戏显示图像而不是字母
- 石头剪刀布 JavaScript 问题
- 两个玩家石头剪刀布在JavaScript
- 我可以'我不明白为什么得分不高;我不在玩石头、布、剪刀的游戏
- 石头剪刀布游戏错误,Javascript
- 学生试图找出javaScript代码的石头剪刀布蜥蜴史波克
- JavaScript中的石头剪刀布
- 如果,则石头剪刀布游戏
- 石头剪刀布Javascript游戏添加选择限制
- JavaScript中的石头剪刀布
- 而不是提示从图像中选择石头,布,剪刀等游戏
- 石头剪刀布递归
- “石头,布,剪刀”在代码中,codecademy
- 总是领带!石头剪刀布游戏
- if 语句 - Javascript 石头剪刀布
- 如何让程序记录“石头-剪刀-布”的分数?游戏