查找与jquery中悬停的元素具有相同父级的所有子级

我有一个主题列表。在每门课里面，我都有项目。当我悬停在一个项目上时，我会尝试更改这个主题的每个项目的颜色。

<div class="subject">
    <div class="item">hello</div>
    <div class="item">hello2</div>
    <div class="item">hello3</div>
</div>
<div class="subject">
    <div class="item">hello</div>
    <div class="item">hello2</div>
    <div class="item">hello3</div>
</div>

如果我真的喜欢，它会改变整个页面的所有项目：

$(".item").hover(function () {
    $(".item").addClass("hovering");
}, function () {
    $(".item").removeClass("hovering");
});

我找不到如何说"所有与我悬停的项目有相同父母的孩子"。。。谢谢

将JS更改为：

$(".item").hover(function () {
    $(this).addClass("hovering");
}, function () {
    $(".item").removeClass("hovering");
});

这是JSFiddle：http://jsfiddle.net/hZ9zb/

使用：

$(".item").hover(function () {
    $(this).parent().find('.item').addClass("hovering");
}, function () {
    $(this).parent().find('.item').removeClass("hovering");
});

jsFiddle示例

$(".item").hover(function () {
   $(this).siblings().addClass("hovering");
 }, function () {
   $(this).siblings().removeClass("hovering");
});

Fiddle

我已经创建了一个jsfiddle，请仔细阅读。

$(document).ready(function()
                  {
  $(".item").hover(function () {
    $(this).addClass("hovering");
   }, function () {
    $(this).removeClass("hovering");
  });
});

http://jsfiddle.net/S8qep/49/

感谢

相关内容

最新更新

热门标签：