如何从动画中排除jQuery对象？

我有一个这样的脚本，为水平手风琴表演动画。每当打开手风琴上的另一张幻灯片（li）时，它就会被放入“活动”对象中

<script type="text/javascript" >
$(document).ready(function(){
    active = $('ul li:first-child');

    $('ul li').click(
      function(){
        $(active).animate({width: '40px'}, { queue:false, duration:600 });
        $('div').fadeOut(100).delay(400).fadeIn(100);
        $(this).animate({width: '660px'}, { queue:false, duration:600});
        active = this;          
      }
    );
});
</script>

---

如何从运行此幻灯片中排除当前打开的幻灯片？我已经试过了。没有和：没有，但可能我做得不对。

在设置任何动画之前，尝试放置一个保护子句。。。 差不多

if (active == this) return; 

作为单击处理程序函数的第一行？

不应

if(this != active[0]) $('div').fadeOut(100).delay(400).fadeIn(100);

---

工作？

jQuery有一种鲜为人知的处理这个问题的方法。使用.not（）函数。您可以使用它从jQuery对象中删除元素

我会这样做：

<script type="text/javascript" >
$(document).ready(function(){
    active = $('ul li:first-child');

    $('ul li').not('li.open').click(
      function(){
        $(this).addClass('open');
        $(active).animate({width: '40px'}, { queue:false, duration:600 });
        $('div').fadeOut(100).delay(400).fadeIn(100);
        $(this).animate({width: '660px'}, { queue:false, duration:600});
        $(active).click(function() { event.StopPropagation(); });
        active = this;          
      }
    );
});
</script>

$（文档）.ready（函数（）{
活动=$（'ul li:first child'）；
$（'ul li'）。不是（'li.open'）。单击(
函数（）{
$（this.addClass（'open'）；
$（活动）.animate（{width:'40px'}，{queue:false，duration:600}）；
$（'div'）.fadeOut（100）、delay（400）、fadeIn（100）；
$（this.animate（{width:'660px'}，{queue:false，duration:600}）；
$（活动）。单击（函数（）{event.StopPropagation（）；}）；
主动=此；
}
);
});

重要的行是.not（'li.open'），然后是“$（this.addClass（'open'）”

---

一旦菜单关闭，您需要添加一种方法来删除所有li中的“open”类，但不知道HTML，我无法告诉您如何最好地执行此操作。

如果您有一些HTML，我会更好地理解您的代码中的一些严重问题，这些问题很可能是意外的。以

$（'div'）…

开头的行在单击时会淡出整个页面上的每个div。这真的是你想要的吗？既然你写的动画效果很好，也许是有意的。第二，以

$开头的行（活动）。单击（函数（）…

在每次单击li时绑定一个新的事件处理程序。这不是您想要的。我相信您想要的是删除该行，并在函数末尾返回false；。考虑一下，也许您想要将事件作为参数e，并在代码中执行此操作：`$（'ul li'）。单击（函数（e）{e.stopPropagation（）；[…]`

<script type="text/javascript" >
$(document).ready(function(){
    active = $('ul li:first-child');

    $('ul li').not('li.open').click(
      function(){
        $(this).addClass('open');
        $(active).animate({width: '40px'}, { queue:false, duration:600 });
        $('div').fadeOut(100).delay(400).fadeIn(100);
        $(this).animate({width: '660px'}, { queue:false, duration:600});
        $(active).click(function() { event.StopPropagation(); });
        active = this;          
      }
    );
});
</script>