简单的Javascript井字游戏
Simple Javascript Tic-Tac-Toe game
我正在尝试编写一个简单的井字游戏,但我在两件事上遇到了问题:
-
我的 3x3 板不会分成不同的行 - 当我尝试制作更多游戏瓷砖时,它只是将其放在同一行
-
我可以通过复制底部的代码来创建新的 X 和 O 图像,但我不知道如何在播放后将它们锁定到位。
这是我当前的 HTML:
<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
#div1 {
width: 80px;
height: 80px;
padding: 10px;
border: 1px solid #aaaaaa;
float:left;
}
</style>
<script type="text/javascript">
function allowDrop(ev) {
ev.preventDefault();
}
function drag(ev) {
ev.dataTransfer.setData("Text",ev.target.id);
}
function drop(ev) {
var data=ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getElementById(data));
ev.preventDefault();
}
</script>
<title>JavaScript Drag & Drop Tic-Tac-Toe</title>
</head>
<body>
<p>Drag the X and O images into the tic-tac-toe board:</p>
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
<img id="drag1" src="X.png" draggable="true"
ondragstart="drag(event)" width="75" height="75" />
<img id="drag2" src="O.png" draggable="true"
ondragstart="drag(event)" width="75" height="75" />
</body>
</html>
你不能给每个div相同的id,id必须对每个div是唯一的。你必须在id的地方上课,我们可以给许多div提供相同的类名。您可以尝试此代码。
<SCRIPT>
if (document.all||document.getElementById){
document.write('<style>.tictac{')
document.write('width:50px;height:50px;')
document.write('}</style>')
}
var sqr1
var sqr2
var sqr3
var sqr4
var sqr5
var sqr6
var sqr7
var sqr8
var sqr9
var sqr1T = 0
var sqr2T = 0
var sqr3T = 0
var sqr4T = 0
var sqr5T = 0
var sqr6T = 0
var sqr7T = 0
var sqr8T = 0
var sqr9T = 0
var moveCount = 0
var turn = 0
var mode = 1
function vari()
{
sqr1 = document.tic.sqr1.value
sqr2 = document.tic.sqr2.value
sqr3 = document.tic.sqr3.value
sqr4 = document.tic.sqr4.value
sqr5 = document.tic.sqr5.value
sqr6 = document.tic.sqr6.value
sqr7 = document.tic.sqr7.value
sqr8 = document.tic.sqr8.value
sqr9 = document.tic.sqr9.value
}
function check()
{
if(sqr1 == " X " && sqr2 == " X " && sqr3 == " X ")
{
alert("You Win!")
reset()
}
else if(sqr4 == " X " && sqr5 == " X " && sqr6 == " X ")
{
alert("You Win!")
reset()
}
else if(sqr7 == " X " && sqr8 == " X " && sqr9 == " X ")
{
alert("You Win!")
reset()
}
else if(sqr1 == " X " && sqr5 == " X " && sqr9 == " X ")
{
alert("You Win!")
reset()
}
else if(sqr1 == " X " && sqr4 == " X " && sqr7 == " X ")
{
alert("You Win!")
reset()
}
else if(sqr2 == " X " && sqr5 == " X " && sqr8 == " X ")
{
alert("You Win!")
reset()
}
else if(sqr3 == " X " && sqr6 == " X " && sqr9 == " X ")
{
alert("You Win!")
reset()
}
else if(sqr1 == " X " && sqr5 == " X " && sqr9 == " X ")
{
alert("You Win!")
reset()
}
else if(sqr3 == " X " && sqr5 == " X " && sqr7 == " X ")
{
alert("You Win!")
reset()
}
else
{
winCheck()
check2()
drawCheck()
}
}
function check2()
{
vari()
drawCheck()
if(sqr1 == " O " && sqr2 == " O " && sqr3 == " O ")
{
alert("You Lose!")
reset()
}
else if(sqr4 == " O " && sqr5 == " O " && sqr6 == " O ")
{
alert("You Lose!")
reset()
}
else if(sqr7 == " O " && sqr8 == " O " && sqr9 == " O ")
{
alert("You Lose!")
reset()
}
else if(sqr1 == " O " && sqr5 == " O " && sqr9 == " O ")
{
alert("You Lose!")
reset()
}
else if(sqr1 == " O " && sqr4 == " O " && sqr7 == " O ")
{
alert("You Lose!")
reset()
}
else if(sqr2 == " O " && sqr5 == " O " && sqr8 == " O ")
{
alert("You Lose!")
reset()
}
else if(sqr3 == " O " && sqr6 == " O " && sqr9 == " O ")
{
alert("You Lose!")
reset()
}
else if(sqr1 == " O " && sqr5 == " O " && sqr9 == " O ")
{
alert("You Lose!")
reset()
}
else if(sqr3 == " O " && sqr5 == " O " && sqr7 == " O ")
{
alert("You Lose!")
reset()
}
}
function player1Check()
{
if(sqr1 == " X " && sqr2 == " X " && sqr3 == " X ")
{
alert("Player 1 wins!")
reset()
}
else if(sqr4 == " X " && sqr5 == " X " && sqr6 == " X ")
{
alert("Player 1 wins!")
reset()
}
else if(sqr7 == " X " && sqr8 == " X " && sqr9 == " X ")
{
alert("Player 1 wins!")
reset()
}
else if(sqr1 == " X " && sqr5 == " X " && sqr9 == " X ")
{
alert("Player 1 wins!")
reset()
}
else if(sqr1 == " X " && sqr4 == " X " && sqr7 == " X ")
{
alert("Player 1 wins!")
reset()
}
else if(sqr2 == " X " && sqr5 == " X " && sqr8 == " X ")
{
alert("Player 1 wins!")
reset()
}
else if(sqr3 == " X " && sqr6 == " X " && sqr9 == " X ")
{
alert("Player 1 wins!")
reset()
}
else if(sqr1 == " X " && sqr5 == " X " && sqr9 == " X ")
{
alert("Player 1 wins!")
reset()
}
else if(sqr3 == " X " && sqr5 == " X " && sqr7 == " X ")
{
alert("Player 1 wins!")
reset()
}
else
{
player2Check()
drawCheck()
}
}
function player2Check()
{
vari()
drawCheck()
if(sqr1 == " O " && sqr2 == " O " && sqr3 == " O ")
{
alert("Player 2 wins!")
reset()
}
else if(sqr4 == " O " && sqr5 == " O " && sqr6 == " O ")
{
alert("Player 2 wins!")
reset()
}
else if(sqr7 == " O " && sqr8 == " O " && sqr9 == " O ")
{
alert("Player 2 wins!")
reset()
}
else if(sqr1 == " O " && sqr5 == " O " && sqr9 == " O ")
{
alert("Player 2 wins!")
reset()
}
else if(sqr1 == " O " && sqr4 == " O " && sqr7 == " O ")
{
alert("Player 2 wins!")
reset()
}
else if(sqr2 == " O " && sqr5 == " O " && sqr8 == " O ")
{
alert("Player 2 wins!")
reset()
}
else if(sqr3 == " O " && sqr6 == " O " && sqr9 == " O ")
{
alert("Player 2 wins!")
reset()
}
else if(sqr1 == " O " && sqr5 == " O " && sqr9 == " O ")
{
alert("Player 2 wins!")
reset()
}
else if(sqr3 == " O " && sqr5 == " O " && sqr7 == " O ")
{
alert("Player 2 wins!")
reset()
}
}
function drawCheck()
{
vari()
moveCount = sqr1T + sqr2T + sqr3T + sqr4T + sqr5T + sqr6T + sqr7T + sqr8T + sqr9T
if(moveCount == 9)
{
reset()
alert("Draw")
}
}
function winCheck()
{
check2()
if(sqr1 == " O " && sqr2 == " O " && sqr3T == 0 && turn == 1)
{
document.tic.sqr3.value = " O "
sqr3T = 1;
turn = 0;
}
else if(sqr2 == " O " && sqr3 == " O " && sqr1T == 0 && turn == 1)
{
document.tic.sqr1.value = " O "
sqr1T = 1;
turn = 0;
}
else if(sqr4 == " O " && sqr5 == " O " && sqr6T == 0 && turn == 1)
{
document.tic.sqr6.value = " O "
sqr6T = 1;
turn = 0;
}
else if(sqr5 == " O " && sqr6 == " O " && sqr4T == 0 && turn == 1)
{
document.tic.sqr4.value = " O "
sqr4T = 1;
turn = 0;
}
else if(sqr7 == " O " && sqr8 == " O " && sqr9T == 0 && turn == 1)
{
document.tic.sqr9.value = " O "
sqr9T = 1;
turn = 0;
}
else if(sqr8 == " O " && sqr9 == " O " && sqr7T == 0 && turn == 1)
{
document.tic.sqr7.value = " O "
sqr7T = 1;
turn = 0;
}
else if(sqr1 == " O " && sqr5 == " O " && sqr9T == 0 && turn == 1)
{
document.tic.sqr9.value = " O "
sqr9T = 1;
turn = 0;
}
else if(sqr5 == " O " && sqr9 == " O " && sqr1T == 0 && turn == 1)
{
document.tic.sqr1.value = " O "
sqr1T = 1;
turn = 0;
}
else if(sqr3 == " O " && sqr5 == " O " && sqr7T == 0 && turn == 1)
{
document.tic.sqr7.value = " O "
sqr7T = 1;
turn = 0;
}
else if(sqr7 == " O " && sqr5 == " O " && sqr3T == 0 && turn == 1)
{
document.tic.sqr3.value = " O "
sqr3T = 1;
turn = 0;
}
else if(sqr1 == " O " && sqr3 == " O " && sqr2T == 0 && turn == 1)
{
document.tic.sqr2.value = " O "
sqr2T = 1;
turn = 0;
}
else if(sqr4 == " O " && sqr6 == " O " && sqr5T == 0 && turn == 1)
{
document.tic.sqr5.value = " O "
sqr5T = 1;
turn = 0;
}
else if(sqr7 == " O " && sqr9 == " O " && sqr8T == 0 && turn == 1)
{
document.tic.sqr8.value = " O "
sqr8T = 1;
turn = 0;
}
else if(sqr1 == " O " && sqr7 == " O " && sqr4T == 0 && turn == 1)
{
document.tic.sqr4.value = " O "
sqr4T = 1;
turn = 0;
}
else if(sqr2 == " O " && sqr8 == " O " && sqr5T == 0 && turn == 1)
{
document.tic.sqr5.value = " O "
sqr5T = 1;
turn = 0;
}
else if(sqr3 == " O " && sqr9 == " O " && sqr6T == 0 && turn == 1)
{
document.tic.sqr6.value = " O "
sqr6T = 1;
turn = 0;
}
else if(sqr1 == " O " && sqr5 == " O " && sqr9T == 0 && turn == 1)
{
document.tic.sqr9.value = " O "
sqr9T = 1;
turn = 0;
}
else if(sqr4 == " O " && sqr7 == " O " && sqr1T == 0 && turn == 1)
{
document.tic.sqr1.value = " O "
sqr1T = 1;
turn = 0;
}
else if(sqr5 == " O " && sqr8 == " O " && sqr2T == 0 && turn == 1)
{
document.tic.sqr2.value = " O "
sqr2T = 1;
turn = 0;
}
else if(sqr6 == " O " && sqr9 == " O " && sqr3T == 0 && turn == 1)
{
document.tic.sqr3.value = " O "
sqr3T = 1;
turn = 0;
}
else if(sqr1 == " O " && sqr4 == " O " && sqr7T == 0 && turn == 1)
{
document.tic.sqr7.value = " O "
sqr7T = 1;
turn = 0;
}
else if(sqr2 == " O " && sqr5 == " O " && sqr8T == 0 && turn == 1)
{
document.tic.sqr8.value = " O "
sqr8T = 1;
turn = 0;
}
else if(sqr3 == " O " && sqr6 == " O " && sqr9T == 0 && turn == 1)
{
document.tic.sqr9.value = " O "
sqr9T = 1;
turn = 0;
}
else if(sqr1 == " O " && sqr9 == " O " && sqr5T == 0 && turn == 1)
{
document.tic.sqr5.value = " O "
sqr5T = 1;
turn = 0;
}
else if(sqr3 == " O " && sqr7 == " O " && sqr5T == 0 && turn == 1)
{
document.tic.sqr5.value = " O "
sqr5T = 1;
turn = 0;
}
else
{
computer()
}
check2()
}
function computer()
{
check2()
if(sqr1 == " X " && sqr2 == " X " && sqr3T == 0 && turn == 1)
{
document.tic.sqr3.value = " O "
sqr3T = 1;
turn = 0;
}
else if(sqr2 == " X " && sqr3 == " X " && sqr1T == 0 && turn == 1)
{
document.tic.sqr1.value = " O "
sqr1T = 1;
turn = 0;
}
else if(sqr4 == " X " && sqr5 == " X " && sqr6T == 0 && turn == 1)
{
document.tic.sqr6.value = " O "
sqr6T = 1;
turn = 0;
}
else if(sqr5 == " X " && sqr6 == " X " && sqr4T == 0 && turn == 1)
{
document.tic.sqr4.value = " O "
sqr4T = 1;
turn = 0;
}
else if(sqr7 == " X " && sqr8 == " X " && sqr9T == 0 && turn == 1)
{
document.tic.sqr9.value = " O "
sqr9T = 1;
turn = 0;
}
else if(sqr8 == " X " && sqr9 == " X " && sqr7T == 0 && turn == 1)
{
document.tic.sqr7.value = " O "
sqr7T = 1;
turn = 0;
}
else if(sqr1 == " X " && sqr5 == " X " && sqr9T == 0 && turn == 1)
{
document.tic.sqr9.value = " O "
sqr9T = 1;
turn = 0;
}
else if(sqr5 == " X " && sqr9 == " X " && sqr1T == 0 && turn == 1)
{
document.tic.sqr1.value = " O "
sqr1T = 1;
turn = 0;
}
else if(sqr3 == " X " && sqr5 == " X " && sqr7T == 0 && turn == 1)
{
document.tic.sqr7.value = " O "
sqr7T = 1;
turn = 0;
}
else if(sqr7 == " X " && sqr5 == " X " && sqr3T == 0 && turn == 1)
{
document.tic.sqr3.value = " O "
sqr3T = 1;
turn = 0;
}
else if(sqr1 == " X " && sqr3 == " X " && sqr2T == 0 && turn == 1)
{
document.tic.sqr2.value = " O "
sqr2T = 1;
turn = 0;
}
else if(sqr4 == " X " && sqr6 == " X " && sqr5T == 0 && turn == 1)
{
document.tic.sqr5.value = " O "
sqr5T = 1;
turn = 0;
}
else if(sqr7 == " X " && sqr9 == " X " && sqr8T == 0 && turn == 1)
{
document.tic.sqr8.value = " O "
sqr8T = 1;
turn = 0;
}
else if(sqr1 == " X " && sqr7 == " X " && sqr4T == 0 && turn == 1)
{
document.tic.sqr4.value = " O "
sqr4T = 1;
turn = 0;
}
else if(sqr2 == " X " && sqr8 == " X " && sqr5T == 0 && turn == 1)
{
document.tic.sqr5.value = " O "
sqr5T = 1;
turn = 0;
}
else if(sqr3 == " X " && sqr9 == " X " && sqr6T == 0 && turn == 1)
{
document.tic.sqr6.value = " O "
sqr6T = 1;
turn = 0;
}
else if(sqr1 == " X " && sqr5 == " X " && sqr9T == 0 && turn == 1)
{
document.tic.sqr9.value = " O "
sqr9T = 1;
turn = 0;
}
else if(sqr4 == " X " && sqr7 == " X " && sqr1T == 0 && turn == 1)
{
document.tic.sqr1.value = " O "
sqr1T = 1;
turn = 0;
}
else if(sqr5 == " X " && sqr8 == " X " && sqr2T == 0 && turn == 1)
{
document.tic.sqr2.value = " O "
sqr2T = 1;
turn = 0;
}
else if(sqr6 == " X " && sqr9 == " X " && sqr3T == 0 && turn == 1)
{
document.tic.sqr3.value = " O "
sqr3T = 1;
turn = 0;
}
else if(sqr1 == " X " && sqr4 == " X " && sqr7T == 0 && turn == 1)
{
document.tic.sqr7.value = " O "
sqr7T = 1;
turn = 0;
}
else if(sqr2 == " X " && sqr5 == " X " && sqr8T == 0 && turn == 1)
{
document.tic.sqr8.value = " O "
sqr8T = 1;
turn = 0;
}
else if(sqr3 == " X " && sqr6 == " X " && sqr9T == 0 && turn == 1)
{
document.tic.sqr9.value = " O "
sqr9T = 1;
turn = 0;
}
else if(sqr1 == " X " && sqr9 == " X " && sqr5T == 0 && turn == 1)
{
document.tic.sqr5.value = " O "
sqr5T = 1;
turn = 0;
}
else if(sqr3 == " X " && sqr7 == " X " && sqr5T == 0 && turn == 1)
{
document.tic.sqr5.value = " O "
sqr5T = 1;
turn = 0;
}
else
{
AI()
}
check2()
}
function AI()
{
vari()
if(document.tic.sqr5.value == " " && turn == 1)
{
document.tic.sqr5.value = " O "
turn = 0
sqr5T = 1
}
else if(document.tic.sqr1.value == " " && turn == 1)
{
document.tic.sqr1.value = " O "
turn = 0
sqr1T = 1
}
else if(document.tic.sqr9.value == " " && turn == 1)
{
document.tic.sqr9.value = " O "
turn = 0
sqr9T = 1
}
else if(document.tic.sqr6.value == " " && turn == 1)
{
document.tic.sqr6.value = " O "
turn = 0
sqr6T = 1
}
else if(document.tic.sqr2.value == " " && turn == 1)
{
document.tic.sqr2.value = " O "
turn = 0
sqr2T = 1
}
else if(document.tic.sqr8.value == " " && turn == 1)
{
document.tic.sqr8.value = " O "
turn = 0
sqr8T = 1
}
else if(document.tic.sqr3.value == " " && turn == 1)
{
document.tic.sqr3.value = " O "
turn = 0
sqr3T = 1
}
else if(document.tic.sqr7.value == " " && turn == 1)
{
document.tic.sqr7.value = " O "
turn = 0
sqr7T = 1
}
else if(document.tic.sqr4.value == " " && turn == 1)
{
document.tic.sqr4.value = " O "
turn = 0
sqr4T = 1
}
check2()
}
function reset()
{
document.tic.sqr1.value = " "
document.tic.sqr2.value = " "
document.tic.sqr3.value = " "
document.tic.sqr4.value = " "
document.tic.sqr5.value = " "
document.tic.sqr6.value = " "
document.tic.sqr7.value = " "
document.tic.sqr8.value = " "
document.tic.sqr9.value = " "
sqr1T = 0
sqr2T = 0
sqr3T = 0
sqr4T = 0
sqr5T = 0
sqr6T = 0
sqr7T = 0
sqr8T = 0
sqr9T = 0
vari()
turn = 0
moveCount = 0
}
function resetter()
{
reset()
}
</SCRIPT>
<FORM NAME="tic" method="post">
<INPUT TYPE="button" NAME="sqr1" class="tictac" value=" " onClick="if(document.tic.sqr1.value == ' ' && turn == 0 && mode == 1) {document.tic.sqr1.value = ' X '; sqr1T = 1; turn = 1; vari(); check();} else if(document.tic.sqr1.value == ' ' && turn == 1 && mode == 2) {document.tic.sqr1.value = ' X '; sqr1T = 1; turn = 0; vari(); player1Check()} else if(document.tic.sqr1.value == ' ' && turn == 0 && mode == 2) {document.tic.sqr1.value = ' O '; sqr1T = 1; turn = 1; vari(); player1Check()} drawCheck()">
<INPUT TYPE="button" NAME="sqr2" class="tictac" value=" " onClick="if(document.tic.sqr2.value == ' ' && turn == 0 && mode == 1) {document.tic.sqr2.value = ' X '; sqr2T = 1; turn = 1; vari(); check();} else if(document.tic.sqr2.value == ' ' && turn == 1 && mode == 2) {document.tic.sqr2.value = ' X '; sqr2T = 1; turn = 0; vari(); player1Check()} else if(document.tic.sqr2.value == ' ' && turn == 0 && mode == 2) {document.tic.sqr2.value = ' O '; sqr2T = 1; turn = 1; vari(); player1Check()} drawCheck()">
<INPUT TYPE="button" NAME="sqr3" class="tictac" value=" " onClick="if(document.tic.sqr3.value == ' ' && turn == 0 && mode == 1) {document.tic.sqr3.value = ' X '; sqr3T = 1; turn = 1; vari(); check();} else if(document.tic.sqr3.value == ' ' && turn == 1 && mode == 2) {document.tic.sqr3.value = ' X '; sqr3T = 1; turn = 0; vari(); player1Check()} else if(document.tic.sqr3.value == ' ' && turn == 0 && mode == 2) {document.tic.sqr3.value = ' O '; sqr3T = 1; turn = 1; vari(); player1Check()} drawCheck()"><br />
<INPUT TYPE="button" NAME="sqr4" class="tictac" value=" " onClick="if(document.tic.sqr4.value == ' ' && turn == 0 && mode == 1) {document.tic.sqr4.value = ' X '; sqr4T = 1; turn = 1; vari(); check();} else if(document.tic.sqr4.value == ' ' && turn == 1 && mode == 2) {document.tic.sqr4.value = ' X '; sqr4T = 1; turn = 0; vari(); player1Check()} else if(document.tic.sqr4.value == ' ' && turn == 0 && mode == 2) {document.tic.sqr4.value = ' O '; sqr4T = 1; turn = 1; vari(); player1Check()} drawCheck()">
<INPUT TYPE="button" NAME="sqr5" class="tictac" value=" " onClick="if(document.tic.sqr5.value == ' ' && turn == 0 && mode == 1) {document.tic.sqr5.value = ' X '; sqr5T = 1; turn = 1; vari(); check();} else if(document.tic.sqr5.value == ' ' && turn == 1 && mode == 2) {document.tic.sqr5.value = ' X '; sqr5T = 1; turn = 0; vari(); player1Check()} else if(document.tic.sqr5.value == ' ' && turn == 0 && mode == 2) {document.tic.sqr5.value = ' O '; sqr5T = 1; turn = 1; vari(); player1Check()} drawCheck()">
<INPUT TYPE="button" NAME="sqr6" class="tictac" value=" " onClick="if(document.tic.sqr6.value == ' ' && turn == 0 && mode == 1) {document.tic.sqr6.value = ' X '; sqr6T = 1; turn = 1; vari(); check();} else if(document.tic.sqr6.value == ' ' && turn == 1 && mode == 2) {document.tic.sqr6.value = ' X '; sqr6T = 1; turn = 0; vari(); player1Check()} else if(document.tic.sqr6.value == ' ' && turn == 0 && mode == 2) {document.tic.sqr6.value = ' O '; sqr6T = 1; turn = 1; vari(); player1Check()} drawCheck()"><br />
<INPUT TYPE="button" NAME="sqr7" class="tictac" value=" " onClick="if(document.tic.sqr7.value == ' ' && turn == 0 && mode == 1) {document.tic.sqr7.value = ' X '; sqr7T = 1; turn = 1; vari(); check();} else if(document.tic.sqr7.value == ' ' && turn == 1 && mode == 2) {document.tic.sqr7.value = ' X '; sqr7T = 1; turn = 0; vari(); player1Check()} else if(document.tic.sqr7.value == ' ' && turn == 0 && mode == 2) {document.tic.sqr7.value = ' O '; sqr7T = 1; turn = 1; vari(); player1Check()} drawCheck()">
<INPUT TYPE="button" NAME="sqr8" class="tictac" value=" " onClick="if(document.tic.sqr8.value == ' ' && turn == 0 && mode == 1) {document.tic.sqr8.value = ' X '; sqr8T = 1; turn = 1; vari(); check();} else if(document.tic.sqr8.value == ' ' && turn == 1 && mode == 2) {document.tic.sqr8.value = ' X '; sqr8T = 1; turn = 0; vari(); player1Check()} else if(document.tic.sqr8.value == ' ' && turn == 0 && mode == 2) {document.tic.sqr8.value = ' O '; sqr8T = 1; turn = 1; vari(); player1Check()} drawCheck()">
<INPUT TYPE="button" NAME="sqr9" class="tictac" value=" " onClick="if(document.tic.sqr9.value == ' ' && turn == 0 && mode == 1) {document.tic.sqr9.value = ' X '; sqr9T = 1; turn = 1; vari(); check();} else if(document.tic.sqr9.value == ' ' && turn == 1 && mode == 2) {document.tic.sqr9.value = ' X '; sqr9T = 1; turn = 0; vari(); player1Check()} else if(document.tic.sqr9.value == ' ' && turn == 0 && mode == 2) {document.tic.sqr9.value = ' O '; sqr9T = 1; turn = 1; vari(); player1Check()} drawCheck()">
</form>
你不能给每个div相同的id,你必须在id的位置使用类。
在allowDrop(event)
中,您需要访问 DOM 中的放置目标并删除 ondragover 事件。这样它就不会再是一个掉落目标了。
要了解这一点,请查看以下资源
- HTML5 拖放规范
- w3学校教程
- HTML5Rocks教程
- HTMLGoodies文章
。等
我曾经使用井字游戏作为示例教授 VB 编程,很高兴看到它也在 JavaScript 中实现。
相关文章:
- Javascript游戏输入失去焦点
- HTML5内存游戏-JavaScript功能
- 正面或反面游戏javascript do/while循环
- 结束一个反应游戏Javascript
- 如何在制作简单的纸牌游戏(Javascript)时给卡牌一个数值
- 根据游戏 JavaScript 中的级别更改背景图像
- 匹配游戏.Javascript.DOM lastChild
- 不可能的井字游戏Javascript
- 第一个编程游戏(javascript/jQuery)的问题
- 随机颜色猜测游戏(JavaScript)
- 井字游戏JavaScript帮助(我没有得到我想要的警报)
- 井字游戏Javascript不会改变玩家
- 井字游戏JavaScript
- 简单纸牌游戏javascript中的indexOf问题
- 游戏JavaScript / JSON链接文本框
- 西蒙游戏javascript,我如何同步按钮的灯不踩在彼此与动画()和延迟()JQUERY
- 井字游戏javascript.如何储存玩家的胜利,并提醒是否有平局
- 内存游戏Javascript中瓦片的悬停状态
- 在游戏 JavaScript 中添加暂停键
- 重新启动逻辑井字游戏(JavaScript)时遇到问题