Question

我希望有一个简单的解决方案，但我现在看不到它。

我正在尝试使用类myClass选择所有div，但忽略所述类的所有子节点，包括具有类myClass的节点。例如：

<div class="myClass"> //select
    <div class="myClass"> //don't
      <div class="myClass"></div> //don't etc
    </div>
</div>
<div class="myClass"></div>
<div class="myClass">
     <div class="myClass"></div>
</div>
<div class="myClass"></div>

我知道这是一个奇怪的情况，这是因为在侧边滑动时需要在Google地图上滑动地图控件（以免覆盖它们）。需要更改的类都命名为'gmnoprint'，如果不忽略子级，则父级中的元素将移动每个嵌套级别所需的两倍。

我目前的解决方案（更多是一个糟糕的黑客）是打电话：

$('div.gmnoprint').stop().animate({ 'marginLeft': '418px' }, 800);
$('div.gmnoprint').children('div.gmnoprint').stop().animate
    ({ 'marginLeft': '0px' }, 800);

但这非常低效且处理器密集。

如果这是重复的道歉，但我找不到类似的东西。

任何帮助非常感谢。

Answer 1

$('div.gmnoprint')
    .filter( function() {
        return $(this).parent().closest('div.gmnoprint').length === 0;
    })
    .stop()
    .animate({ 'marginLeft': '418px' }, 800);

Answer 2

这些div必须都存在于某种其他容器中。如果我们假设它的id为container，请致电：

$('#container').children('div.gmnoprint').stop().animate({ 'marginLeft': '418px' }, 800);

这只会深入一级，而不会选择页面上的所有div.gmnoprint元素。

选择并使用类为所有div设置动画，但忽略具有相同类的所有子项

2 个答案: