tictoc game
by Akram kamal
HTML
<div>
<div id="d1" class="c1" style="height: 50px;width:50px;border:1px solid black;float:left"></div>
<div id="d2" class="c1" style="height: 50px;width:50px;border:1px solid black;float:left"></div>
<div id="d3" class="c1" style="height: 50px;width:50px;border:1px solid black;float:left"></div>
</div>
<div>
<div id="d4" class="c1" style="height: 50px;width:50px;border:1px solid black;float:left;clear:left"></div>
<div id="d5" class="c1" style="height: 50px;width:50px;border:1px solid black;float:left"></div>
<div id="d6" class="c1" style="height: 50px;width:50px;border:1px solid black;float:left"></div>
</div>
<div>
<div id="d7" class="c1" style="height: 50px;width:50px;border:1px solid black;float:left;clear:left"></div>
<div id="d8" class="c1" style="height: 50px;width:50px;border:1px solid black;float:left"></div>
<div id="d9" class="c1" style="height: 50px;width:50px;border:1px solid black;float:left"></div>
</div>
JavaScript
var p=0
$(".c1").click(function(){
var letter=p%2===0?"X":"O"
if($(this).text()===""){
$(this).text(letter)
if (
q('d1','d2','d3')||
q('d4','d5','d6')||
q('d7','d8','d9')||
q('d1','d4','d7')||
q('d2','d5','d8')||
q('d3','d6','d9')||
q('d1','d5','d9')||
q('d3','d5','d7')
) {
setTimeout(function(){
alert(letter+" wins")
$(".c1").text("")
})
}
p++
}
})
function q(a,b,c){
var va=v(a)
return va.length&&va===v(b) && va===v(c)
}
function v(id){
return $("#"+id).text()
}