이 같은 HTML에서 버튼 (사각형)의 목록이

Question

자바 스크립트 코드 내에서 HTML 버튼에 이벤트 핸들러를 추가하는 방법 -

<td><button id="18" ></button></td> 
    <td><button id="28" ></button></td> 
    <td><button id="38" ></button></td> 
      ... 

앞서 각 버튼을, I 버튼 내에서 코드를 삽입했다 태그 자체에 다음과 같은 이벤트 처리기를 추가하십시오. -

<button id="18" onclick="squareWasClicked(event)"> 

    function squareWasClicked(event) 
    { 
     var element = event.target; 

     // more code 
    } 

하지만 지금은 좋은 습관이 아닙니다. 그래서 대신, 내 자바 스크립트 코드 내에서 이벤트 처리기를 추가하려고합니다. 하지만 어떻게해야할지 모르겠다. 지금까지이 시도했다 -

function assignEventsToSquares() 
    { 
    var i,j; 

    for(i=1;i<=8;i++) 
     { 
     for(j=1;j<=8;j++) 
     { 
      var squareID = "" + i + "" + j; 
      var square = document.getElementById(squareID);   
      square.onclick = squareWasClicked(); 
     } 
     } 
    } 

하지만 단순히이 함수는 squareWasClicked() 함수를 호출합니다. 그렇다면 사각형을 클릭 할 때 함수가 호출되도록 이벤트 처리기로 추가하려면 어떻게해야합니까? 또한, 어떻게 말합니까?

 square.onclick = squareWasClicked(event); 

이벤트는 JavaScript 코드에서 감지되지 않습니다. 도와주세요.

Answer 1

square.onclick = squareWasClicked(); 

될 것입니다. 함수 자체가 할당되도록 ()을 제거하십시오. 따라서 , 상기 [사양]에 따른 메모 측면이

square.onclick = squareWasClicked; 

Answer 2

element.addEventListener() (DOM 2 Events spec에서 유래 됨)을 사용하십시오. 귀하의 경우는 이것은 당신의 클릭 함수를 호출하고 당신이 원하는 아니다 당신의 요소의 이벤트 리스너, 그 결과를 할당

document.getElementById("18").addEventListener("click", squareWasClicked, false);