我的卡片記憶游戲上有一個“提示”按鈕，可以讓所有不匹配的卡片正面朝上 1 秒鐘。我有那個作業的代碼。然而，它并沒有顯示所有的卡片面孔（例如，“太陽”、“地球”、“火星”），它只顯示所有卡片中的一個卡片面孔影像（例如，“火星”、“火星”、“火星”） . 每次重繪 時它顯示的卡片都不同，可能全是“地球”或全是“火星”等，但問題仍然存在，只顯示一張卡片影像。
我的卡面影像隨機排列。現在我不確定如何獲得提示按鈕來顯示所有卡片面孔。我希望這是有道理的？我將添加一張照片作為示例：https ://imgur.com/a/pqXJL0M
它還會翻開已經匹配的卡片……但這是一個我以后可以解決的問題。
這是我的卡片的 HTML：
<div class="container">
<div class="container-top">
<div class="card unmatched"></div>
<div class="card unmatched"></div>
<div class="card unmatched"></div>
<div class="card unmatched"></div>
</div>
<div class="container-bottom">
<div class="card unmatched"></div>
<div class="card unmatched"></div>
<div class="card unmatched"></div>
<div class="card unmatched"></div>
</div>
</div>
這是用于隨機化它們的 JS/jQuery：
let cards = [
"Elements/images/EarthCard.jpg",
"Elements/images/EarthCard.jpg",
"Elements/images/JupiterCard.jpg",
"Elements/images/JupiterCard.jpg",
"Elements/images/MarsCard.jpg",
"Elements/images/MarsCard.jpg",
"Elements/images/MercuryCard.jpg",
"Elements/images/MercuryCard.jpg",
];
shuffle();
//Function to shuffle array order
function shuffle() {
let random = 0;
let temp = 0;
for (i = 1; i < cards.length; i ) {
random = Math.round(Math.random() * i);
temp = cards[i];
cards[i] = cards[random];
cards[random] = temp;
}
assignCards();
} //End of shuffle func
//function to assign shuffled array to cards
function assignCards() {
$(".card").each(function(index) {
$(this).attr("data-card-value", cards[index]);
});
clickHandlers();
} //End of assignCards func
//Function to add 'selected' tag to clicked on cards
function clickHandlers() {
$(".card").on("click", function() {
$(this)
.html("<img src='" $(this).data("cardValue") "'/>")
.addClass("selected");
checkMatch();
});
} // End of clickHandlers function
這是我的提示功能：
//Function to turn cards when hint button clicked
function showHint() {
{
//show card hint side
$(".card")
.html("<img src='" $(".card").data("cardValue") "'/>")
.show();
}
setTimeout(function() {
//show card back side
$(".card").html("<img src= 'Elements/images/CardBack.jpg' />").show();
}, 1000);
score = score - hintclick;
$(".scorecounter").html("Score: " score);
}
如果您需要游戲代碼，我也可以編輯添加，我不想用太多代碼使帖子超載。
我認為問題出在我的提示功能中，我需要向其添加一些內容，但我不確定到底要添加什么，當我閱讀其他人類似問題的解決方案時，我只是不確定如何實施那進入我的代碼。
uj5u.com熱心網友回復：
您將需要遍歷每張卡片，而不是一次將影像應用于所有卡片。
$(".card").each(function(){
$(this).html("<img src='" $(this).data("cardValue") "'/>").show();
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/537609.html
上一篇：為調查分析中的模型撰寫R函式
下一篇：Firefox和Chrome之間針對HTMLCanvasfillRect操作和fontBoundingBoxAscent的行為差異