javascript - 动画不止于可变值

为什么百分比在第一个动画之后没有停止。就是在填充栏之后。

$('.perctext').delay(1500).each(
     function(a)
       $(this).delay(a*250).animate({
     'left':width
  },1000);
});

FIDDLE

我想念什么？

先感谢您。

解决方案：检查搅拌机波纹管中的答案。
FIDDLE WITH SOLUTION

最佳答案

您每次都在DOM中查询与选择器匹配的元素，因此第一栏与一个类别为perctext的元素匹配，第二栏与上一个栏的百分比文本元素及其自身匹配，第三栏与所有栏匹配三。

将创建的元素存储在变量中，并仅为该特定元素设置动画

var $perctext = $('<div>', {'class': 'perctext', text: width});
$perctext.appendTo(this);

$perctext.delay(1500).each(function(a) {
    $(this).delay(a * 250).animate({
        'left': width
    }, 1000);
});

关于javascript - 动画不止于可变值，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/22887552/