동적 버튼 스크립트가 작동하지 않습니다.

Question

자바 스크립트를 사용하여 html 테이블에 동적 버튼을 만들었습니다. 코드는이 방법

         $('#dataTables-data').empty(); 

             jQuery.each(searchTO, function(i, item) { 

              historyrowid += '<tr><td style=" border: 1px solid black;">' + Math.round(item.SNo * 100)/100+ 
                  '</td><td style=" border: 1px solid black;">' +Math.round(item.DistributorId* 100)/100 + 
                  '</td><td style=" border: 1px solid black;">' +item.DistributorName+  
                  '</td><td style=" border: 1px solid black;">' +item.Bonuspercent + 
                  '</td><td style=" border: 1px solid black;">' +Math.round(item.PrevCumPV * 100)/100+ 
                  '</td><td style=" border: 1px solid black;">' + Math.round(item.exclpv* 100)/100 +  
                  '</td><td style=" border: 1px solid black;">' + Math.round(item.SelfBV * 100)/100+  
                  '</td><td style=" border: 1px solid black;">' + Math.round(item.grouppv * 100)/100+ 
                  '</td><td style=" border: 1px solid black;">' + Math.round(item.Totalpv * 100)/100+              
                  '</td><td style=" border: 1px solid black;">' + Math.round(item.totalBv * 100)/100+  
                  '</td><td style=" border: 1px solid black;"><button type="button" class="Downline_button" id="'+item.DistributorId+'" >Downline</button></td></tr>'; 
             }); 

            $('#dataTables-example').append(historyrowid); 

에 있으며 생성 된 테이블이

하지만 난이 버튼을 아무것도에 이벤트를 만들 때 일입니다 .. 버튼 내 이벤트 코드는

같다

$(".Downline_button").click(function(){ 
      debugger; 
      var id = this.id; 
      }); 

그래서 어떻게 동적 버튼에 이벤트를 만들 수 있고 어떻게 버튼 ID를 읽을 수 있습니까?

Answer 1

이벤트 핸들러를 문서에 첨부하고 이벤트를 요소에 위임해야합니다. 이것은 상관없이 document.ready 이전에 생성 된() 여부와이 ID를 가진 모든 요소에 적용됩니다

$(document).on('click', '.Downline_button', function(){ 
      debugger; 
      var id = this.id; 
}); 

:

은 당신이 뭔가를 할 수 있습니다.