Question

我有这种格式的表格：

it 'should fetch user if he has no rsvp at all' do
  # Given
  user = User.create!(email: 'm@m.com', password: '12345678', password_confirmation: '12345678')

  # Then
  expect(User.free(Date.new(2014, 1, 1)).count).to eq 1
end

当点击某个SPAN时，我希望所有特定TR内的跨距将变为灰色。

我该怎么做？

<tr>
  <td><span></span></td>
  <td><span></span></td>
  <td><span></span></td>
</tr>

<tr>
  <td><span></span></td>
  <td><span></span></td>
  <td><span></span></td>
</tr>

Answer 1

span不是直接孩子，因此您需要使用 find() 而tr是td的父级，而不是{{1}的父级所以使用 closest() 。要使用 css() 来应用样式， css() 中也不需要span。

!important

Answer 2

Jquery parents(selector)获取祖先的匹配选择器
Jquery find(selector)获取子树中的匹配子项

运行代码段以查看结果

$(document).ready(function() {
  $("span").click(function() {
    $(this).parents("tr").find("span").attr('style', 'color: #838282');
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<table>
  <tr>
    <td><span>A</span>
    </td>
    <td><span>B</span>
    </td>
    <td><span>C</span>
    </td>
  </tr>
  <tr>
    <td><span>D</span>
    </td>
    <td><span>E</span>
    </td>
    <td><span>F</span>
    </td>
  </tr>
</table>

Answer 3

您可以尝试以下JavaScript代码：

$('tr span').click(function(){
    $(this).closest('tr').find('span').css('color', '#838282');
});

Answer 4

$("span").on("click",function()
{
    $(this).parents("tr").find("span").css('color', '#838282');
});

改变元素颜色的数量

4 个答案: