Question

单击表格行时尝试显示隐藏的元素。每一行都有一个具有相同类名的元素实例，但我只想在被点击的同一行上显示该元素。这是html结构

<table id="task-table">
  <tr>
    <td>1</td>
    <td>2</td>
    <td><span class="icons"> i c o n </span>3</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td><span class="icons"> i c o n </span>3</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td><span class="icons"> i c o n </span>3</td>
  </tr>
</table>

这是jquery

  $('#task-table').on('click', 'tr', function() {
    $(this).next('.icons').show('fast');
  });

如果有人帮忙，我做错了什么？

Answer 1

.next会在tr之后查看兄弟姐妹。所以，.next('tr')会给你一个结果，但不是你想要的。你想要的是：

$(this).find('.icons').show('fast');

工作小提琴：http://jsfiddle.net/8yx6P/2/

Answer 2

喜欢这个

<table id="task-table">
  <tr id="1">
    <td>1</td>
    <td>2</td>
    <td><span class="icons_1"> i c o n </span>3</td>
  </tr>
  <tr id="2">
    <td>1</td>
    <td>2</td>
    <td><span class="icons_2"> i c o n </span>3</td>
  </tr>
  <tr id="3">
    <td>1</td>
    <td>2</td>
    <td><span class="icons_3"> i c o n </span>3</td>
  </tr>
</table>

$('#task-table').on('click', 'tr', function() {
    var id = $(this).attr('id');

$('.icons_'+id).show('fast');
  });

看看是否可以帮助你

此处正在使用FIddle

http://jsfiddle.net/maree_chaudhry/TYCq3/

从单击的表行中查找下一个类实例

2 个答案: