[JQUERY] 상위 tr의 이벤트를 한개 td에서는 제외시키기

• 테이블 한 열(tr)을 클릭하면 기능이 실행되게끔 on이벤트(click) 처리해둔 상태
• 이 열의 삭제 기능을 추가해야되는 상황 발생
• td 한칸에 버튼을 추가했고 그 버튼의 기능이 실행되기 전 기존 tr에 걸려있는 on('click') 이벤트가 실행되는 것 확인

테이블 상황

th1 번호	th2 썸네일	th3 제 목	th4 등록날짜	th5
<tr> <td1> 1	<td2> 사진	<td3> 테스트	<td4> 2019-7-5	<td5> 삭제 버튼 </tr>

소스 코드

$("#테이블아이디 tr").on('click',function(e){
    //tr을 클릭했을때 실행할 기능
    console.log("test");
   
});

• 전체 코드는 promise를 써서 <tr> 이하 내용을 javascript로 입력하고 then에 이 소스 코드가 등장함
• td 5개중에 <td5>만 tr의 이벤트에서 제외시켜야 하는 상황

$("#테이블아이디 tr").each(function(){
     var lastTd = $(this).find(":last-child"); //여기서는 <td5>
     $("#"+lastTd[2].id).on('click',function(e){
         e.stopImmediatePropagation(); //chrome에서
        //이 td에서만 실행할 기능
         console.log('hello');
     });
});
 
$("#테이블아이디 tr").on('click',function(e){
    //tr을 클릭했을때 실행할 기능
    console.log("test");
   
});

1. <tr>에 on('click') 이벤트를 걸기전에 <tr>들의 마지막 <td>를 구해놓고(2번 line)
2. 마지막<td>의 상위객체인 <tr>의 이벤트를 막는다.(3~7번 line)