これは、Tic Tac Toe ゲームでターンを作成するにはどうすればよいですか?に関するものです。 一度クリックしたらボックスを上書きしないというオプションを追加したかったのです。私は以下のコードを使用し、それとオンラインの資料を数回調べましたが、答えがわかりません。X、O、X の代わりにすべてのボックスが突然 X になりました。 残念ながら、私は Jquery をサポートしない Web ベースのエディターで作業しており、HTML も編集できません。
var turn = "X";
function next()
{
turn = turn === "X" ? "O" : "X";
}
function play() {
if (this.innerHTML === "")
{
this.innerHTML == turn;
next();}
}
function click()
{
if (this.id == "cell1")
{
document.getElementById("cell1").innerHTML= turn;
play();
}
else if (this.id == "cell2")
{
document.getElementById("cell2").innerHTML = turn;
play();
}
else if (this.id == "cell3")
{
document.getElementById("cell3").innerHTML = turn;
play();
}
else if (this.id == "cell4")
{
document.getElementById("cell4").innerHTML = turn;
play();
}
else if (this.id == "cell5")
{
document.getElementById("cell5").innerHTML = turn;
play();
}
else if (this.id == "cell6")
{
document.getElementById("cell6").innerHTML = turn;
play();
}
else if (this.id == "cell7")
{
document.getElementById("cell7").innerHTML = turn;
play();
}
else if (this.id == "cell8")
{
document.getElementById("cell8").innerHTML = turn;
play();
}
else if (this.id == "cell9")
{
document.getElementById("cell9").innerHTML =turn;
play();
}
}
document.getElementById("cell1").onclick = click;
document.getElementById("cell2").onclick = click;
document.getElementById("cell3").onclick = click;
document.getElementById("cell4").onclick = click;
document.getElementById("cell5").onclick = click;
document.getElementById("cell6").onclick = click;
document.getElementById("cell7").onclick = click;
document.getElementById("cell8").onclick = click;
document.getElementById("cell9").onclick = click;
コードを繰り返さないように言われたことは知っていますが、これについてはかなり初心者です。たぶん、数か月の練習で十分な自信が持てるようになるでしょう。
PS: セルの上書きを停止する機能を追加しようとする前は、問題なく動作していました。その前のコードは次のとおりです。
var nextTurn = 'X';
function changeTurn(){
if(nextTurn == 'X'){
nextTurn = 'O';
} else {
nextTurn = 'X';
}
}
新しいオプションについては、以前の投稿の別のユーザーの助けを借りて、nextTurn を turn に、changeTurn を next に変更しました。