JS : parentNode를 삭제하는 동적으로 생성 된 DOM 객체에 addEventListener 추가

Question

사용자 입력 숫자를 사용하여 간단한 계산을 수행 한 다음 클릭하여 계산을 새 행의 표에 추가합니다. . 표에는 세 개의 숫자에 대해 세 개의 열이 있어야합니다. 모든 것은 괜찮지 만, 나는 이것에 붙어있다 : 사용자를위한 옵션을 추가하여 행의 일부를 삭제하는 방법은 무엇인가?

 <tbody id="tableBody"> 
      <tr id="row8"> <!-- In js this is ("row" + i) --> 
       <td class="dimA"></td> 
       <td class="dimB"></td> 
       <td class="area"></td> 
       <td><input type="checkbox" id="del8"></td> <!-- In js this is ("del" + i) --> 
      </tr> 
     </tbody> 

그래서, TR 소자는 자바 스크립트에 의해 생성되고, 상기 식별자에 난 모든 첨가 후에 증가되어

그래서,이 HTML 구조 것이다. 사용자가 확인란을 선택하면 전체 행을 삭제할 수 있어야합니다. addEventListener를 사용하여 작업하는 방법을 알고 있지만 알 수없는 항목으로 처리하는 방법은 무엇입니까? 여기

는 자바 스크립트입니다 :

function dodajNaListu(eventInfo) { 
    if (dimA & dimB !== 0) { 
     var tr = document.createElement("tr"); 
     tr.id = "row" + i; 

     var td1 = document.createElement("td"); 
     td1.className = "dimA"; 
     var A = document.createTextNode(dimA); 
     td1.appendChild(A); 

     var td2 = document.createElement("td"); 
     td2.className = "dimB"; 
     var B = document.createTextNode(dimB); 
     td2.appendChild(B); 

     var td3 = document.createElement("td"); 
     td3.className = "area"; 
     var P = document.createTextNode(rezultat); 
     td3.appendChild(P); 

     var td4 = document.createElement("td"); 
     var chck1 = document.createElement("input"); 
     chck1.id = "del" + i; 
     chck1.setAttribute("type", "checkbox"); 
     td4.appendChild(chck1); 

     tr.appendChild(td1); 
     tr.appendChild(td2); 
     tr.appendChild(td3); 
     tr.appendChild(td4); 
     document.getElementById("tableBody").appendChild(tr); 
     i++; 
    } 
} 

는 당신의 도움을 주셔서 감사합니다, 나는이 분야에서 명백한 초보자입니다. 아니, jQuery를 사용하지 않습니다. 이것은 실제로 내 작업에 필요한 Windows 8.1 응용 프로그램입니다.

Answer 1

좋아, 대답을 찾았습니다. 여기 jsfiddle 링크는 다음과 같습니다 http://www.joegarrepy.com/tableaddrow_jscript.htm :

여기

function delRow() { 
    var current = window.event.srcElement; 
    while ((current = current.parentElement) && current.tagName != "TR"); 
    current.parentElement.removeChild(current); 
} 

내가 내 대답을 찾을 수있는 웹 페이지에 링크입니다 :이 함수를 호출 기능 dodajNaListu 내에서 생성 된 모든 체크 박스에 이벤트 리스너를 추가

http://jsfiddle.net/sez1bwL3/

멋진 하루 되십시오.