我现在有一个随机顺序的卡片,但游戏只会在我选择 c13.gif 卡片时结束。我曾尝试使用 else if 来解决这个问题,但不幸的是,这不起作用。如果 13 号(国王)牌中的任何一张被选中,我希望你结束游戏。该游戏的概念与扫雷类似。
<!DOCTYPE HTML>
<html>
<body>
<head>
<meta charset="utf-8">
<title>Don't Pick the King!</title>
<table style="width:50%">
<tr>
<td><img src="cards/b.gif" Class="back" id="card_0" onClick="flipCard(0);"></td>
<td><img src="cards/b.gif" Class="back" id="card_1" onClick="flipCard(1);"></td>
<td><img src="cards/b.gif" Class="back" id="card_2" onClick="flipCard(2);"></td>
</tr>
<tr>
<td><img src="cards/b.gif" Class="back" id="card_3" onClick="flipCard(3);"></td>
<td><img src="cards/b.gif" Class="back" id="card_4" onClick="flipCard(4);"></td>
<td><img src="cards/b.gif" Class="back" id="card_5" onClick="flipCard(5);"></td>
</tr>
<tr>
<td><img src="cards/b.gif" Class="back" id="card_6" onClick="flipCard(6);"></td>
<td><img src="cards/b.gif" Class="back" id="card_7" onClick="flipCard(7);"></td>
<td><img src="cards/b.gif" Class="back" id="card_8" onClick="flipCard(8);"></td>
</tr>
<tr>
<td><img src="cards/b.gif" Class="back" id="card_9" onClick="flipCard(9);"></td>
<td><img src="cards/b.gif" Class="back" id="card_10" onClick="flipCard(10);"></td>
<td><img src="cards/b.gif" Class="back" id="card_11" onClick="flipCard(11);"></td>
</tr>
</table>
<p id="score" style="float:center">If you pick a king you lose.</p>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="hard-copy.html">Restart</a></li>
</ul>
</div>
<style>
* {
background-color: lightblue;
border-color: hsla(173,100%,50%,1.00);
font-weight: bold;
}
ul {
list-style-type: none;
margin:0;
padding:0; <!--- Getting rid of the bullets within the list -->
}
.back
{width:100px;
height:100px;
}
</style>
<script language="JavaScript">
/*ID of each card 0,1,2
3,4,5,
6,7,8,
9,10,11 ---12 cards 0 being the 1st and 11 being 12th card */
var deck = ["cards/c11.gif","cards/c12.gif","cards/d11.gif","cards/d12.gif","cards/h11.gif",
"cards/h12.gif","cards/s11.gif","cards/s12.gif","cards/c13.gif", "cards/d13.gif", "cards/h13.gif", "cards/s13.gif"];
//deck of cards
function shuffle(deck){
for(swaps=0; swaps<11; swaps++){
var shuffle1=Math.floor(Math.random()*deck.length);
var shuffle2=Math.floor(Math.random()*deck.length);
var temp=deck[shuffle1];
deck[shuffle1]=deck[shuffle2];
deck[shuffle2]=temp;
}
}
//for loop there to shuffle from deck the 12 cards
//var shuffles randomises deck every time game is played
var disabledCards = [];
var gameOver = false;
function flipCard(card) {
if(!gameOver) //if game not over
{
if(disabledCards[card] !== false) //not equal value or not equal type
{
if(deck[card] != "cards/c13.gif")
{
disabledCards[card] = false;
selection = card;
document.images[card].src = deck[card];
}
else {
gameOver = true;
alert("You chose a King! ¯|_(ツ)_|¯" );
}
} else {
alert("Card has already been clicked! ¯|_(ツ)_|¯" );
}
} else {
alert("Game has already ended! ¯|_(ツ)_|¯");
}
}
//when user clicks on a card the card will flip over and choose random image from deck
function onLoad(){
shuffle(deck);
}
//when program first loads up place the cards in a random order
document.addEventListener("DOMContentLoaded", onLoad);
//event listener waits for DOM to finish loading then executes onLoad function
</script>
</body>
</html>
最佳答案
不要每次选择卡片时都调用随机播放,您可以让它只执行一次,当 DOM 完成加载时。并将 var 关键字添加到变量中。试试这个:
var deck = ["cards/c11.gif", "cards/c12.gif", "cards/d11.gif", "cards/d12.gif", "cards/h11.gif",
"cards/h12.gif", "cards/s11.gif", "cards/s12.gif", "cards/c13.gif", "cards/d13.gif", "cards/h13.gif", "cards/s13.gif"
];
deck(1, 0);
function shuffle(deck) {
for (var swaps = 0; swaps < 12; swaps++) {
var shuffle1 = Math.floor(Math.random() * deck.length);
var shuffle2 = Math.floor(Math.random() * deck.length);
var temp = deck[shuffle1];
deck[shuffle1] = deck[shuffle2];
deck[shuffle2] = temp;
}
}
function flipCard(card) {
selection = card;
document.images[card].src = deck[card];
}
function onLoad() {
shuffle(deck)
}
document.addEventListener("DOMContentLoaded", onLoad);
关于javascript - 当任何国王(卡片 13)被选中时,我如何让我的游戏结束?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30064283/