jquery - jQuery FadeIn/FadeOut，遍历数组

Question

在这个网址 - http://thespacebetweenthewords.org/sandbox/

我正在尝试使用 jQuery FadeIn/FadeOut 效果循环遍历单词数组。

不过，显示的单词数组似乎不是从 [0] 开始的。我可能在函数执行的顺序上遗漏了一些东西。

如果社区中的任何人想对到目前为止的代码发表评论，我们将不胜感激。

Answer 1

您正确地使用了回调函数.fadeIn()来确保单词在完成淡入之前不会开始淡出。但是，您没有将相同的原则应用于遍历动词。你的外层for循环会立即撕开所有的动词，显示每一个，然后耐心地等待直到隐藏它们的时候（当然，那时只有最近的动词仍然会显示）。

你可以尝试这样的事情：

function showWord(selector, words, wordTime, i) {
    if (words.length < i)
        return;
    var word = words[i];
    $(selector).html(word).fadeIn(wordTime, function() {
        $(selector).fadeOut(wordTime, function() {
            showWord(selector, words, wordTime, i + 1);
        });
    });
}
showWord("#verb-content", data.verbs, verbTime, 0);