테이블 러에서 행 선택

Question

I 사용자 테이블 리터 내 프로젝트에서 jQuery 플러그인 (다른 것에 대해 알고 있습니다). 사용자가 행을 클릭하면 선택이 선택되는 기능을 추가해야합니다. 다음 코드를 시도했지만 작동하지 않습니다.

$('#myTable tr').click(function(event) {
     $(this).addClass('selected');

 });

누구든지 가장 좋은 방법을 말해 줄 수 있습니까? 이미 플러그인이 있습니까?

미리 감사드립니다.
압델 올라 카라

Answer 1

테이블 러가 전체 테이블을 재현하여 TR에 첨부 된 클릭 이벤트를 "파괴"할 때 변화가없는 이유가 될 수 있다고 생각합니다. 라이브 이벤트를 사용하여 시도하고 그것이 작동하는지 확인해야합니다. jQuery.com에서 라이브 이벤트 문서

Answer 2

jQuery의 토그 클래스를 통해 선택 및 선택치를 활성화하려면 :

$(document).ready( function() {
    /* jQuery v1.11.1 */
    $( "table.tablesorter tbody tr" ).click(function() {
      $( this ).toggleClass( "selected" );
    });
});

/* CSS for hover row & select/lock the row with color */
table.tablesorter tbody tr:hover td {
    background-color: #f4f5f6;
}
table.tablesorter tbody tr.selected td {
    background-color: #f4f5f6;
}

Answer 3

그것은 나에게 맞아 보인다. tr.Selected에 대해 정의 된 CSS 클래스가 있습니까?

클릭 할 때 TR이 아닌 TD 요소를 쳤을 수도 있습니다. 부모를 사용해야 할 수도 있습니다.

http://docs.jquery.com/traversing/parent

이와 같은 것 (테스트되지 않은) :

$('#myTable td').click(function(event) {
         $(this).parent("tr").addClass('selected');

 });

Answer 4

당신이 가지고있는 것은 올바른 것 같습니다. 문서가 준비된 후 실행하고 있습니까?

$(function() {
    $('#myTable tr').click(function() {
         $(this).addClass('selected');
    });
});

또는 사용할 수 있습니다 live 이벤트.

$('#myTable tr').live('click', function() {
     $(this).addClass('selected');
});

Answer 5

클릭 이벤트가 내 테이블에서 잘 작동하는 것 같습니다. 다시 클릭하여 어떻게 선택 해제 할 것인지 궁금합니다. 변수를 선택하는지 여부에 연결하는 것은 쉬운 솔루션처럼 보이지만 어떻게해야합니까?

다른 질문과 JS에 대한 새로운 질문으로 당신의 질문에 대답하는 것을 용서하십시오.