-1
乱数が選択され、4つのボタンが表示されるゲームを作成しようとしています（最終的には結晶になります）。jQueryを使用してクリックゲームをデバッグするためのヘルプを探しています
私は、各ボタンに隠れた値が設定されていることを確認しようとしています。目標は正確に与えられた乱数に一致しています。
私は次のことが私にそれを与えると思ったが、私は間違っている。プレイヤーはプログラムが実行されて2番目に勝つように見え、私はif文から期待していたように勝利と損失はHTMLに書き込まれません。
私は間違っていますか？
$(document).ready(function() {
var randomNumber = Math.floor(Math.random() * 100) + 1;
var crystalNumber1;
var crystalNumber2;
var crystalNumber3;
var crystalNumber4;
var total = 0;
var currentTotal = $("#total");
function makeCrystal1() {
crystalNumber1 = Math.floor(Math.random() * 12) + 1
};
function makeCrystal2() {
crystalNumber2 = Math.floor(Math.random() * 12) + 1
};
function makeCrystal3() {
crystalNumber3 = Math.floor(Math.random() * 12) + 1
};
function makeCrystal4() {
crystalNumber4 = Math.floor(Math.random() * 12) + 1
};
function makeRandom() {
randomNumber = Math.floor(Math.random() * 100) + 1;
}
function reset() {
makeRandom();
makeCrystal1();
makeCrystal2();
makeCrystal3();
makeCrystal4();
total = 0;
}
reset();
var win = 0;
var losses = 0;
$("#random-number").append(randomNumber);
function addTo(number) {
total = total + number;
}
$("#crystal1").on("click", function() {
addTo(crystalNumber1);
currentTotal.html(total);
});
$("#crystal2").on("click", function() {
addTo(crystalNumber2);
currentTotal.html(total);
});
$("#crystal3").on("click", function() {
addTo(crystalNumber3);
currentTotal.html(total);
});
$("#crystal4").on("click", function() {
addTo(crystalNumber4);
currentTotal.html(total);
});
if (total > randomNumber) {
losses++;
reset();
$("#messages").html("Oh no! You destroyed your crystals!");
}
if (total = randomNumber) {
wins++;
$("#wins").html(wins);
reset();
$("#messages").html("You are a crystal master!");
}
})<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Crystal Game</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery.js"></script>
</head>
<body>
<div class="container-fluid">
<div class="page-header">
<h1>Crystal Game <small>Can you match the number?</small></h1>
</div>
<p>A random number will appear.</p>
<p>Click on the crystals to find out their individual value.</p>
<p>Win the game by clicking the right combination of crystals to match the number. Don't go over the number or you lose!</p>
<p>Good luck!</p>
<div class="row">
<div class="col-xs-5">
<div id="random-number"></div>
</div>
<div class="col-xs-3">
<p id="alert"></p>
<p>Wins:
<div id="wins"></div>
</p>
<p>Losses:
<div id="losses"></div>
</p>
</div>
</div>
<div class="row">
<div class="col-xs-2">
<a id="crystal1" class="btn btn-default" href="#" role="button">
<img src="" alt="">crystal1
</a>
</div>
<div class="col-xs-2">
<a id="crystal2" class="btn btn-default" href="#" role="button">
<img src="" alt="">crystal2
</a>
</div>
<div class="col-xs-2">
<a id="crystal3" class="btn btn-default" href="#" role="button">
<img src="" alt="">crystal3
</a>
</div>
<div class="col-xs-2">
<a id="crystal4" class="btn btn-default" href="#" role="button">
<img src="" alt="">crystal4
</a>
</div>
</div>
<br>
<div class="row">
The current total is:
<div id="total"></div>
</div>
<div class="row">
<div id="crystal-count"></div>
</div>
<div class="row">
<div id="messages"></div>
</div>
</div>
<script type="text/javascript" src="assets/javascript/game.js"></script>
</body>
</html>
間違った比較演算子を追加した番号を参照するために、すべてのボタンのワンクリックハンドラを使用してIDを確認するように...統合することができrandomNumber） '...は' === 'でなければなりません。 – charlietfl
@charlietflと同様に、 'if（total = randomNumber）'は常に真実であるため、ユーザーはすぐに勝利します。クリスタル番号をランダムに生成する関数が1つだけ必要です。各クリスタルに固有の関数を作成するが、それらのすべてが同じタスクを実行することは冗長です。 – Nadav
@charlietflはい！やあ！ –