버튼 클릭에 따라 테이블 행 표시/숨기기

Question

표의 마지막 열의 체크 박스가 선택되었는지 여부에 따라 표 행을 숨기거나 표시하려면 표 옆에 토글 버튼을 사용하고 싶습니다. I이 버튼이 사이드 바에서

<table> 
    <tr> 
    <td>1<td> 
    <td>Text<td> 
    <td><input type="checkbox" class="form-checkbox" checked="checked"><td> 
    </tr> 
    <tr> 
    <td>2<td> 
    <td>Text<td> 
    <td><input type="checkbox" class="form-checkbox"><td> 
    </tr> 
</table> 

: 여기서

테이블의 코드이며, I는 토글 경우 사라질 1 행에 대한 상기 예에서

<a id="comtoggle" class="btn" href="#">Toggle</a> 

싶습니다 버튼을 클릭했지만 토글 버튼을 다시 클릭하면 다시 나타납니다. 체크 박스의 상태는 데이터베이스에 저장되며 AJAX 함수를 통해 저장됩니다 (정상적으로 작동 함).

여기 jQuery가 있습니다. 내 문제는 .is (': checked') 세 번째 줄에 사용하고 있다고 생각합니다. 이 조각으로

$("#comtoggle").click(function() { 
    if ($('.form-checkbox').is(':checked')) { 
    $('.form-checkbox').is(':checked').closest('tr').toggle(); 
    } 
}); 

, 내 모든 행이 사라하고, 방화범의 콘솔이 오류를 보여줍니다이 관련되어

TypeError: $target.offset(...) is null

확실하지합니다.

Answer 1

나는 이것이 당신이 의미하는 것이라고 생각합니다. 또한 바이올린을 잡으십시오 : http://jsfiddle.net/7C423/1 당신이해야 할 일은 단지 당신이 볼에 관심이 있고 그것을하는 것입니다.

$("#comtoggle").click(function() { 
     $(".form-checkbox:checked").closest("tr").toggle(); 
}); 

Answer 2

클래스별로 요소를 선택하기 때문에 물마루를 반복해야하고 행을 숨기는 것으로 선택해야합니다.

$("#comtoggle").click(function() { $('.form-checkbox').each(function(chk){ if($(this).is(':checked')) $(this).closest("tr").toggle(); }); });