채택완료
jquery 테이블 rowspan tr 삭제 질문입니다.
삭제 버튼을 눌렀을때 채크박스를 선택해서 빨간 박스안의 tr을 remove()하고 싶습니다.
빨간색 박스를 선택하려면 어떻게 해야 하나요?
Copy
<html><head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /></head><body><button id="delete">삭제</button> <table> <tr> <th>lesson</th> <th>class</th> <th>absent</th> <th>substitute</th> </tr> <tr> <td rowspan="2"><input type="checkbox" id="cbx" name="cbx"/></td> <td>1b</td> <td>John</td> <td>Max</td> </tr> <tr> <td>3a</td> <td>Bev</td> <td>Abbi</td> </tr> <tr> <td rowspan="2"><input type="checkbox" id="cbx" name="cbx"/></td> <td>1b</td> <td>John</td> <td>Max</td> </tr> <tr> <td>3a</td> <td>Bev</td> <td>Abbi</td> </tr> </table></body></html>
|
답변 4개 / 댓글 4개
채택된 답변
+20 포인트
Copy
<html><head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /></head><body> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script><script> $(function(){ $("#delete").click(function(){ $("input[name=cbx]:checked").each(function(){ $(this).parent().parent().next().remove(); $(this).parent().parent().remove(); }); }) }); </script> <button id="delete">삭제</button> <table> <tr> <th>lesson</th> <th>class</th> <th>absent</th> <th>substitute</th> </tr> <tr> <td rowspan="2"><input type="checkbox" name="cbx"/></td> <td>1b</td> <td>John</td> <td>Max</td> </tr> <tr> <td>3a</td> <td>Bev</td> <td>Abbi</td> </tr> <tr> <td rowspan="2"><input type="checkbox" name="cbx"/></td> <td>1b</td> <td>John</td> <td>Max</td> </tr> <tr> <td>3a</td> <td>Bev</td> <td>Abbi</td> </tr> </table></body></html></script>id="cbx" 는 제거해주세요. ID 는 중복하시면 안됩니다.
Copy
$(function() { $("#delete").on("click", function() { var chk = $("input[name='cbx']:checked").length; if(chk > 0) { $("input[name='cbx']:checked").each(function() { $(this).closest("tr").next().remove(); $(this).closest("tr").remove(); }); } else { alert("삭제할 항목 없음"); } });});삭제하려는 tr끼리 같은 class를 주세요.. 물론 출력할때부터 고려해야겠죠...
답변에 대한 댓글 2개
답변을 작성하려면 로그인이 필요합니다.