Question

我试图在序列中设置所有LI的动画，但代码会立即为所有LI设置动画。

我无法在任何地方找到有用的回复，我知道如何在Jquery中执行此操作，但这里没有添加内容。

我试图将Timeout添加到eventhandler和被调用的函数，这两种方法都不起作用。

这是功能

__init__.py

链接到codepen：

http://codepen.io/damianocel/pen/PzYXmv

我试图在调用中添加stopPropagation / preventDefault，但这也无济于事。

Answer 1

您的代码存在一些问题。首先，900不是setTimeout的参数，而是forEach.call的参数。这似乎只是一个错误。

其次，即使修复了上述内容，您的代码也会在将来设置900ms的单个超时，然后迭代列表中的所有li并转换它们马上。我相信你真正想要做的是循环所有你的项目并定义一个超时，以便在将来运行一段时间。由于forEach提供了索引，因此您可以使用静态ms计数，并使用当前索引列表对其进行多次计算，以便从现在进一步动画显示。

我相信你实际上正在寻找这样的东西，它循环你的li列表，并设置一个变换发生在每个项目100ms的前一个：

function changeLi() {
  [].forEach.call(li, function(li, i) {
    setTimeout(function() {
      li.style.transform = "translateX(200px)";
    }, 100 * i);
  });
}

在[] forEach.call上的vanilla JS上的SetTimeout不能按顺序工作

1 个答案: