Jquery: Zaznacz/usuń podświetlony wiersz tabeli po kliknięciu

Question

Chcę, aby mój skrypt podświetlał wybrany wiersz i działa świetnie, ale gdy zaznaczono/podświetlono wiersz, chcę go "odznaczony/odznaczony", jeśli inny wiersz jest wybrany. Jak mam to zrobic?

Oto aktualny kod do wybierania wiersza, to odznacza, ale tylko wtedy, gdy klikam na samym wierszu ponownie:

$(".candidateNameTD").click(function() { 
      $(this).parents("tr").toggleClass("diffColor", this.clicked); 
     }); 

Html stół

<table id="newCandidatesTable"> 
    <thead> 
     <tr> 
      <th style="cursor: pointer;">ID</th> 
      <th style="cursor: pointer;">Navn</th> 
      <th style="cursor: pointer;">Email</th> 
      <th></th> 
     </tr> 
    </thead> 
    <tbody> 
    <% foreach (var candidate in Model.Ansogninger) 
    { 
     %> 
      <tr id="<%= candidate.AnsogerID %>" class="newCandidatesTableTr"> 
       <td><div id="candidateID"><%= candidate.AnsogerID %></div></td> 
       <td><div id="<%= "candidateName_" + candidate.AnsogerID %>" class="candidateNameTD"><%= candidate.Navn %></div></td> 
       <td><div id="candidateEmail"><%= candidate.Email %></div></td> 
       <td> 
        <div id="<%= "acceptCandidateButton_" + candidate.AnsogerID %>" class="acceptb" style="cursor: pointer; border: 1px solid black; width: 150px; text-align: center;">Godkend</div> 
       </td> 
      </tr> 
     <% 
    } %> 
    </tbody> 
    </table> 

Answer 1

Można najpierw usunąć zaznaczenie wszystkich wiersze, takie jak

$(".candidateNameTD").click(function() { 
     $(this).closest("tr").siblings().removeClass("diffColor"); 
     $(this).parents("tr").toggleClass("diffColor", this.clicked); 
    }); 

edytuj: tak, sry, ale th e pomysł miał rację;)

Answer 2

$(".candidateNameTD").click(function() { 
      $("tr").removeClass("diffColor"); 
      $(this).parents("tr").addClass("diffColor"); 
     }); 

Answer 3

ta będzie dotyczyła jedynie aktualną tabelę:

$(".candidateNameTD").click(function() { 
    $('table#newCandidatesTable tr').removeClass("diffColor"); 
    $(this).parents("tr").addClass("diffColor"); 
}); 

Answer 4

najlepiej za pomocą .live. Jedno zdarzenie jest preferowane w stosunku do wielu (pomyśl o dużym stole, dużym obciążeniu).

$("div.candidateNameTD").live('click'. function() { 
    var $tr = $(this).closest("tr"); 
    //remove any selected siblings 
    $tr.siblings().removeClass('diffColor'); 
    //toggle current row 
    $tr.toggleClass('diffColor');   
});