我只想 fadein/fadeout 数组中的术语列表一次

Question

我正在尝试制作一些标题，这些标题会淡入和淡出登录页面一次，然后不再重复。这是我一直在尝试使用的代码。当然，它永远重复。我是一个初学者，并试图包含一个计数器变量，该变量将获取数组中最后一项的索引号，当达到该数字时，停止重复。这样就可以添加文本而无需更新第 n 个项目编号。

// after the last title in the array has been displayed, stop loop  
// +++++++++++++++++++ changeTitle

var titles = ["title zero", "title one", "title two", "title three",
    "title four", "title n"
];

function changeTitle() {  
    var ct = $("#title").data("term") || 0;

    $("#title").data("term", ct == titles.length - 1 ? 0 : ct + 1)
               .text(titles[ct])
               .fadeIn(200)
               .delay(500)
               .fadeOut(200, changeTitle);
}
$(changeTitle);

Answer 1

在您的 html 中的某个地方，您应该打开一个脚本标记并在 文档准备就绪后执行它 。那是一个常见的JQuery模式

<script>
    $(document).ready(function() {
        changeTitle();
    });
</script>

这应该可以完成工作。由于您正在使用 jQuery 无论如何这不会引入任何新的依赖项。

Answer 2

jsFiddle Example

jQuery.each(titles, function( index, value ) {
   $("#title").fadeIn(200).delay(500).fadeOut(200, function() {
               $("#title").text(value);
    });
});

我只想 fadein/fadeout 数组中的术语列表一次

I would like to fadein/fadeout a list of terms from an array only once

javascript

arrays

loops

break