Jquery, 어떻게하면 테이블 행을 제거한 후 테이블 행 색상을 유지할 수 있습니까?

Question

제목이 이해가 안된다면, 기본적으로 다음과 같은 테이블 행이 있습니다.

<table> 
<tr class="odd"> 
<td><button class="button_clicked">Hide row</button></td> 
</tr> 
<tr class="even"> 
<td><button class="button_clicked">Hide row</button></td> 
</tr> 
<tr class="odd"> 
<td><button class="button_clicked">Hide row</button></td> 
</tr> 
<tr><td class="notes"</td></tr> 
</table> 

각 tr에는 클래스가 있고, 홀수는 흰색 배경이며 회색 배경도 있습니다. 한 jd 단추 중 하나가 클릭 한 다음 단추를 클릭 한 전체 tr 행 숨기기 jquery 사용하여 Im. 일부 테이블 행에는 노트 다음에 추가로 tr이 있으므로 jquery가 그 테이블이 존재하는지 여부를 감지합니다. 그렇다면 해당 tr도 제거하십시오. 하지만 문제는 내가 회색 배경을 가진 tr을 숨기면 그 아래의 테이블 행이 나타나고 이제는 흰색 인 두 개의 테이블 행이 있고 테이블 행의 홀수/짝수 설계가 깨집니다. 그래서 추가 검사를하기 위해 아래에 추가 코드를 작성하려했지만 스크립트가 작동하지 않습니다. 그것은 나에게 오류를주지 않는다, 그냥 스크립트가 중단, 모든 제안을 보여줍니다?

  $('.button_clicked').click(function(e) { 

     var row = $(this).closest('tr'); 

     // hide this row first 
     row.hide(); 

     // next, get the next TR, see if it is a notes row, and hide it if it is 
     var nxt = row.next(); 

     if (nxt.hasClass('show_notes')) { 

      nxt.hide(); 

     }else 
     { 

      if (nxt.hasClass('odd')) { 

       nxt.attr('class','even'); 

      }else 
      { 

       nxt.attr('class','odd'); 

      } 

     } 

     e.preventDefault(); 

    }); 

Answer 1

에 한번이 아니라

if (nxt.hasClass('show_notes')) { 
    nxt.hide(); 
} 
else { 
    row.nextAll('tr').toggleClass('odd even'); 
} 

을하고