использование цикла
Всем привет, я абсолютный новичок в программировании. Сделал игру крестики-нолики, все работает, но код ужасно громоздкий хотелось бы вот эту часть провести через какой-нибудь цикл
if( ($('#1 p').text() === '0' || $('#1 p').text() === 'X') && ($('#2 p').text() === '0' || $('#2 p').text() === 'X') && ($('#3 p').text() === '0' || $('#3 p').text() === 'X') && ($('#4 p').text() === '0' || $('#4 p').text() === 'X') && ($('#5 p').text() === '0' || $('#5 p').text() === 'X') && ($('#6 p').text() === '0' || $('#6 p').text() === 'X') && ($('#7 p').text() === '0' || $('#7 p').text() === 'X') && ($('#8 p').text() === '0' || $('#8 p').text() === 'X') && ($('#9 p').text() === '0' || $('#9 p').text() === 'X')){ alert('Ничья'); } возможно ли такое? если да, то как? заранее спасибо. |
Stabby,
а это точно ничья? |
Да, все поля заполняются Х и 0 выходит ничья, есть еще два условия на победу, когда 3 клетки подряд заполнены одним знаком.
|
Цитата:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.first {
width: 300px;
height: 300px;
}
.first div{
float: left;
width: 96px;
height: 96px;
border: 2px solid rgba(139, 69, 19, 1);
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function(){
var s = $(".first p");
s.text(function(indx, element){
return Math.random() > .5 ? '0' : 'X'
});
if( ($('#1 p').text() === '0' || $('#1 p').text() === 'X') &&
($('#2 p').text() === '0' || $('#2 p').text() === 'X') &&
($('#3 p').text() === '0' || $('#3 p').text() === 'X') &&
($('#4 p').text() === '0' || $('#4 p').text() === 'X') &&
($('#5 p').text() === '0' || $('#5 p').text() === 'X') &&
($('#6 p').text() === '0' || $('#6 p').text() === 'X') &&
($('#7 p').text() === '0' || $('#7 p').text() === 'X') &&
($('#8 p').text() === '0' || $('#8 p').text() === 'X') &&
($('#9 p').text() === '0' || $('#9 p').text() === 'X')){
alert('Ничья');
}
});
</script>
</head>
<body>
<div class='first'>
<div id="1">
<p></p>
</div>
<div id="2">
<p></p>
</div>
<div id="3">
<p></p>
</div>
<div id="4">
<p></p>
</div>
<div id="5">
<p></p>
</div>
<div id="6">
<p></p>
</div>
<div id="7">
<p></p>
</div>
<div id="8">
<p></p>
</div>
<div id="9">
<p></p>
</div>
</div>
</body>
</html>
|
Нет, Вы не поняли, перед этим условием стоит другое условие на победу, если оно выполнится, все поля очищаются. В любом случае, можно ли как-то прогнать через цикл?
|
Цитата:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.first {
width: 300px;
height: 300px;
}
.first div{
float: left;
width: 96px;
height: 96px;
border: 2px solid rgba(139, 69, 19, 1);
}
body{
width: 2000px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function(){
var s = $(".first p");
s.text(function(indx, element){
return Math.random() > .5 ? '0' : 'X'
});
var ary = document.querySelectorAll('.first p');
ary = [].every.call(ary,function(p) {
var text = p.textContent || p.innerText;
return text === 'X' || text === '0';
});
ary && alert('Ничья');
});
</script>
</head>
<body>
<div class='first'>
<div id="1">
<p></p>
</div>
<div id="2">
<p></p>
</div>
<div id="3">
<p></p>
</div>
<div id="4">
<p></p>
</div>
<div id="5">
<p></p>
</div>
<div id="6">
<p></p>
</div>
<div id="7">
<p></p>
</div>
<div id="8">
<p></p>
</div>
<div id="9">
<p></p>
</div>
</div>
</body>
</html>
|
А может после проверки на победу просто проверить остались ли пустые клетки?
|
ну, самое простое, что напрашивается:
var flag = true;
for(var i=1; i<=9; i++) {
if($('#'+i+' p').text() === '0' || $('#'+i+' p').text() === 'X')) {
// условие выполнено. продолжаем цикл
flag = true;
} else {
// не выполнено. выходим из цикла. не ничья
flag = false;
break;
}
}
if(flag) { alert('Ничья'); }
|
Цитата:
Цитата:
Пожалуйста, отформатируйте свой код! Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [js] ... ваш код... [/js] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
Спасибо! А отличие в следующем: если человек - новичек, то этот код он поймет) а Ваш скорее всего нет.
|
| Часовой пояс GMT +3, время: 12:43. |