Javascript 具有动态元素属性的多个：not（）

这是演示

我想做的是：

如果。列表项的属性数据属性为真，则禁用动画

以下是工作示例：

$('.list-item > a:not(.active)').hover(function(){
        $(this).clearQueue().stop().animate({
            marginLeft: 40
        }, 250);
    }, function(){
        $('.list-item:not([data-attr="true"]) > a:not(.active)').clearQueue().stop().animate({
            marginLeft: 0
        }, 250);
 });

---

但我不确定这是否合适。有什么想法吗？

你真的应该使用mouseenter，mouseleave events，基于：并且在你的小提琴中，你有一个部件可以在点击时设置父元素的数据，这可能更简单：

$('li.list-item').on('mouseenter', '>a:not(.active)', function () {
    $(this).clearQueue().stop().animate({
        marginLeft: 40
    }, 250);
});
$('li.list-item').on('mouseleave', '>a:not(.active)', function () {
    $(this).clearQueue().stop().animate({
        marginLeft: 0
    }, 250);
});

$('.list-item[data-toggle="collapse"] ').on('click', '>a', function () {
    $(this).parent().data('attr', !$(this).parent().data('attr'));
});

EDIT1：旁注，您还可以捕获元素上的第二个事件，而不是保存

.parent（）

遍历的链接，如中所示：

$('.list-item[data-toggle="collapse"] ').click( function () {
    $(this).data('attr', !$(this).data('attr'));
});

如果您正在动态创建附加到ul的li元素：

$('ul').on('click', '.list-item[data-toggle="collapse"] ', function () {
    alert($(this).data('attr'));
    $(this).data('attr', !$(this).data('attr'));
});

---

我看你的代码没有任何问题。你可以用它。你说的“解除绑定动画”是什么意思？动画没有绑定。正如@sdespont所说，您的代码可以正常工作。作为一个旁注，你可以考虑<代码>左撇子<代码> > <代码> MulnLeule。因为如果鼠标位于左边的缩进空间，它就可以在鼠标器/鼠标输出环中捕获动画。您使用的是什么版本的jQuery？Hover在1.9中被去除，在我意识到这一点之前，我使用了它，并遇到了奇怪的结果-它的行为有点像toggle，但不可靠。此代码

$（'.list item[data toggle=“collapse”]）.on（'click'，'>a'，function（）{$（this）.parent（）.data（'attr'，！$（this.parent（）.data（'attr'）；）

和其他两个变体对我不起作用。您的脚本不会切换数据属性true/FALSE。您的脚本在悬停状态下工作正常，但动画不会在

时停止。列表项
具有
数据属性=“true”