JQuery 兄弟姐妹（）。仅将 class 添加到任何行中单击的列

Question

它适用于每一行。如何从任何行一次只使用它？仅将 class 添加到任何行中的单击列，所有 tr class 中的所有其他 td 应为空。请帮忙

$('td').click(function(){
    $(this).siblings('td').removeClass('active');
    $(this).addClass('active');
});

http://jsfiddle.net/5QsCy/3/

Answer 1

您需要从所有 td 元素中删除 active class。截至目前，您仅从同级 td 元素中删除 class。

$('td').click(function(){
    $('td.active').removeClass('active'); //Remove active class from all td
    $(this).addClass('active');
});

DEMO

Answer 2

为什么不在将所有 td 设置为新单元格之前简单地删除 active class？

$('td').click(function(){
    $('td').removeClass('active');
    $(this).addClass('active');
});

.active {
  border: solid 1px red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>COL</td>
    <td>COL</td>
  </tr>
  <tr>
    <td>COL</td>
    <td>COL</td>
  </tr>
  <tr>
    <td>COL</td>
    <td>COL</td>
  </tr>
<table>

Answer 3

$('#xyz td').click(function(){
    $("#xyz").find('td').removeClass('active');
    $(this).addClass('active');
});

HTML:-

 <table id="xyz">
    <tr><td>COL</td><td>COL</td></tr>
    <tr><td>COL</td><td>COL</td></tr>
    <tr><td>COL</td><td>COL</td></tr>
    <table>

CSS:-

.active {border:solid 1px red;}

DEMO

JQuery 兄弟姐妹（）。仅将 class 添加到任何行中单击的列

JQuery siblings(). add class only to clicked column in any row

jquery

siblings