我想让我的脚本突出显示我选择的行,它的效果很好,但是当选择/突出显示一行时,如果选择另一行,我希望它被“取消选择/取消选中”。我该怎么做?
这里是选择行的当前代码,它取消选择,但只有当我再次单击同一行时:
$(".candidateNameTD").click(function() { $(this).parents("tr").toggleClass("diffColor",this.clicked); });
Html表
<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>
解决方法
您可以先取消选择所有行,例如
$(".candidateNameTD").click(function() { $(this).closest("tr").siblings().removeClass("diffColor"); $(this).parents("tr").toggleClass("diffColor",this.clicked); });
编辑:yep,sry,但是想法是对的)