0
私はシモンゲームを作ろうとしていますが、ランダムに発生した問題を実行しました。 showColorStart()関数が実行され、指定された色をクリックすると、colorsClicked[index]がcolorsPicked[index]に等しくても、33行目のifステートメントが実行され、等しくないときにステートメントを実行する必要があります。JS＆Jquery：文が条件を満たしていない場合でも
ここにコードon Codepenがあります。
// Setting Variables
var gameStatus = false;
var strict = false;
var playerTurn = true;
var colors = ['green', 'red', 'yellow', 'blue'];
var colorsPicked = [];
var colorsClicked = [];
var level = 1;
var index = -1;
var lindex = 0;
var showOn = false;
// Game Status Function
$('#start').click(function(){
if(gameStatus == false){
gameStatus = true;
gameStart();
}
});
// Game Start Function
function gameStart(){
}
// Chaning color buttons
$('.cubes').click(function(e){
if(playerTurn = true){
index++;
$(e.target).addClass(e.target.id);
colorsClicked.push(e.target.id);
setTimeout(function(){
$(e.target).removeClass(e.target.id);
}, 500);
// Player's turn & check if got the right colors
if(colorsClicked[index] !== colorsPicked[index]){
index=0;
lindex=0;
alert('Failed! Try again.');
showColorStart();
} else {
if(colorsPicked.length == colorsClicked.length){
level++;
randomColor();
showColorStart();
}
}
} else {
return;
}
});
// Random Color Picking Function
function randomColor(){
var random = Math.floor(Math.random() * 4);
colorsPicked.push(colors[random]);
}
// Colors Showing at Start of a level
function showColorStart(){
if(!showOn){
showOn == true;
playerTurn = false;
lindex = 0;
var colorLoop = setInterval(function(){
if(colorsPicked[lindex] == 'green'){
$('#green').addClass('green');
} else if(colorsPicked[lindex] == 'red'){
$('#red').addClass('red');
} else if(colorsPicked[lindex] == 'yellow'){
$('#yellow').addClass('yellow');
} else if(colorsPicked[lindex] == 'blue'){
$('#blue').addClass('blue');
}
setTimeout(function(){
$('#green').removeClass('green');
$('#red').removeClass('red');
$('#yellow').removeClass('yellow');
$('#blue').removeClass('blue');
}, 500);
lindex++;
if(lindex == colorsPicked.length){
clearInterval(colorLoop);
showOn = false;
lindex = 0;
index = 0;
colorsClicked = [];
$('#disp').html('Your Turn!');
setTimeout(function(){
$('#disp').html('');
}, 1000);
playerTurn = true;
}
}, 1500);
} else {
return;
}
}
randomColor();
randomColor();
showColorStart();<DOCTYPE html>
<html>
<head>
<title>Simon Game</title>
<link href="style.css" type="text/css" rel="stylesheet"/>
<link href='bootstrap.min.css' type="text/css"/>
</head>
<body>
<div class="container">
<div class="menu">
<input type='button' value='Start' id='start' class='btn'>
<input type='button' value='Restart' id='restart' class='btn'>
<input type='button' value='Strict' id='strict' class='btn'>
</div>
<div class='board'>
<div class='display'><p id='disp'></p></div>
<br>
<table>
<tbody>
<tr>
<td class='cubes' id='green'></td>
<td class='cubes' id='red'></td>
</tr>
<tr>
<td class='cubes' id='yellow'></td>
<td class='cubes' id='blue'></td>
</tr>
</tbody>
</table>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="app.js"></script>
</body>
</html>
で始めますか？ –
@SatishKumar 33行目のif文は、サイモンゲームの失敗条件です。プレイヤーが間違った色をクリックした場合、このif文が実行されます。問題は、正しい色をクリックしてもif文が実行されてしまうことです。 – WackThat
私がスタートをクリックすると色が見えません。ところで、あなたは=の代わりに** showOn == true; **を使用しているのが分かります。ここでも** if（playerTurn = true）**比較のために==を使用している必要があります。 –