2016-07-11 4 views
0

그래서 나는 완전히 함께 코딩하기에 새롭고 나는 그것에 대단히 끔찍하다! 간단한 tic tac toe 보드를 만들려고했는데 이전 버튼이 표시 한 것을 기반으로 X 또는 O 중 하나를 표시하는 버튼을 가져와야합니다. 이전 버튼을 다시 참조하도록하려면 어떻게합니까? 여기까지 내가 지금까지 가지고있는 것이고 그것은 단순한 슈퍼가되기로되어있다. 저를 올바른 방향으로 안내 할 수있는 사람이 있습니까?자바 스크립트가있는 간단한 Tic Tac Toe

<button onclick="switchIt(this)">&nbsp;</button>//An example of button 

을 그리고 : 단순히

var btn = document.getElementById("mybtn1"); 
btn.innerHTML = btn.innerHTML === "X" ? "O" : "X"; 

또는를 :

<!DOCTYPE html> 
<html> 
<head> 
<title> Project 8 </title> 
</head> 
<body> 
<p>Click the button once to change its value</p> 

<button id="mybtn1" onclick="myFunction1()">&nbsp;</button> 
<button id="mybtn2" onclick="myFunction2()">&nbsp;</button> 
<button id="mybtn3" onclick="myFunction3()">&nbsp;</button> 
<p style="clear:both"></p> 
<button id="mybtn4" onclick="myFunction1()">&nbsp;</button> 
<button id="mybtn5" onclick="myFunction2()">&nbsp;</button> 
<button id="mybtn6" onclick="myFunction3()">&nbsp;</button> 
<p style="clear:both"></p> 
<button id="mybtn7" onclick="myFunction1()">&nbsp;</button> 
<button id="mybtn8" onclick="myFunction2()">&nbsp;</button> 
<button id="mybtn9" onclick="myFunction3()">&nbsp;</button> 

<p></p> 

<script> 

    var X= document.getElementById("mybtn1").innerHTML; 

function myFunction1() { 
    //var X= document.getElementById("mybtn1").innerHTML; 
    if (X == "&nbsp;") { 
     document.getElementById("mybtn1").innerHTML = "X"; 
    } 
    else (X == "X") { 
    document.getElementById("mybtn1").innerHTML = "O"; 
    } 
    else if (X == "O") { 
    document.getElementById("mybtn1").innerHTML = "X"; 
    } 
} 

function myFunction2() { 
    //var X= document.getElementById("mybtn2").innerHTML; 
    if (X == "&nbsp;") { 
     X="X" 
     document.getElementById("mybtn2").innerHTML = X; 
    } 
    if (X == "X") { 
    document.getElementById("mybtn2").innerHTML = "O"; 
    } 
    if (X == "O") { 
    document.getElementById("mybtn2").innerHTML = "X"; 
    } 
} 

function myFunction3() { 
    //var X= document.getElementById("mybtn3").innerHTML; 
    if (X == "&nbsp;") { 
     document.getElementById("mybtn3").innerHTML = X; 
    } 
    if (X == "X") { 
    document.getElementById("mybtn3").innerHTML = "O"; 
    } 
    if (X == "O") { 
    document.getElementById("mybtn3").innerHTML = "X"; 
    } 
} 
</script> 


</body> 
</html> 

답변

2

이 시도 할 수

function switchIt(btn) { 
    btn.innerHTML = btn.innerHTML === "X" ? "O" : "X"; 
} 

데모 :https://jsfiddle.net/iRbouh/6qn9Lz9u/1/

+0

답해 주셔서 감사합니다. 이 장소는 어디에서 배치해야합니까? 함수 이전에? – Jenny

+0

데모를 확인하십시오. –