Javascriptエラー：HTMLTableCellElement.onclickで関数が定義されていません

Question

HTML/JSでチック・タック・トゥ・ゲームを作ろうとしていますが、私のオンクリックは機能しなくなりました。関数は定義されていません。私はclear（）関数をjQueryに変更しようとしましたが、テストできません。

Here is a jsfiddle.

基本的に、

var counter = 0; 
function draw(elmt){ 
    if(elmt.innerHTML == "x" || elmt.innerHTML == "o") 
    { 
     //do nothing 
    } 
    else{ 
    if(counter==0){ 
     elmt.innerHTML = "x"; 
     counter = 1; 
    } 
    else{ 
     elmt.innerHTML = "o"; 
     counter = 0; 
    } 
    } 
} 

ありがとうこのjavascript関数を認識するために

<td class="tile" id="pos1" onclick="draw(this); checkWinner();"></td> 

をこのHTMLを取得しています！

Answer 1

checkWinner関数が定義されておらず、すべての関数がグローバルスコープに定義されていることを確認してください。たとえば、window.draw()にアクセスできる必要があります。最後に

、あなたも同じように、便利なイベントハンドラをバインドするためにjQueryを使用することができます。

`` `

$('.tile').on('click', draw); 

function draw(e) { 
    var html = $(this).html(); 
    if(html == "x" || html == "o") 
    { 
    //do nothing 
    } else{ 
    if(counter==0){ 
     $(this).html("x"); 
     counter = 1; 
    } 
    else{ 
     $(this).html("o"); 
     counter = 0; 
    } 
    } 
} 

` ``

var counter = 0; 
 
function draw(elmt){ 
 
    if(elmt.innerHTML == "x" || elmt.innerHTML == "o") 
 
    { 
 
     //do nothing 
 
    } else{ 
 
     if(counter==0){ 
 
      elmt.innerHTML = "x"; 
 
      counter = 1; 
 
     } 
 
     else{ 
 
      elmt.innerHTML = "o"; 
 
      counter = 0; 
 
     } 
 
    } 
 
} 
 
function checkWinner(){ 
 

 
}

<table> 
 
<tr> 
 
<td class="tile" id="pos1" onclick="draw(this); checkWinner();"> 
 
Click Here 
 
</td> 
 
</tr> 
 
</table>

Answer 2

私は彼らがjsfiddleで何か間違っているはずだと思いますこれはあなたのコードは私

[just remove `$(document).ready(function() {})`]