Javascript 淡入淡出，无循环_Javascript_Jquery_Html_Css_Fadein

Javascript 淡入淡出，无循环

javascript jquery html css

Javascript 淡入淡出，无循环,javascript,jquery,html,css,fadein,Javascript,Jquery,Html,Css,Fadein,代码如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script src="http://ajax.googleapis.com/ajax/libs/

代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style>
.quotes {display: none;}
</style>
</head>

<body>
<h2 class="quotes">first quote</h2>
<h2 class="quotes">second quote</h2>

<script>
(function() {

    var quotes = $(".quotes");
    var quoteIndex = -1;

    function showNextQuote() {
        ++quoteIndex;
        quotes.eq(quoteIndex % quotes.length)
            .fadeIn(2000)
            .delay(2000)
            .fadeOut(2000, showNextQuote);
    }

    showNextQuote();

})();
</script>
</body>
</html>


无标题文件
.quotes{显示：无；}
第一句话
第二句话
（功能（）{
var报价=$（“.quotes”）；
var quoteIndex=-1；
函数showNextQuote（）{
++报价索引；
quotes.eq（quoteIndex%quotes.length）
fadeIn先生（2000年）
.延迟（2000年）
.fadeOut（2000年，showNextQuote）；
}
showNextQuote（）；
})();

它按预期工作，应该循环，但我想摆脱循环。如果有人能帮忙，我将不胜感激

编辑：我希望它一旦进入第二个引号，就不会消失并停留在那里。

正如您所评论的，您不想消失最后一个引号，我认为只要有一个

if

条件来检查它是否是最后一个引号，如果是，不要说要

淡出
定义您的函数showNextQuote
如下所示
 function showNextQuote() {
        ++quoteIndex;
        if(quoteIndex==quotes.length-1){ //if it's the last quote
            quotes.eq(quoteIndex).fadeIn(2000); //jsut fad-in & return
            return;
        }
        quotes.eq(quoteIndex)
            .fadeIn(2000)
            .delay(2000)
            .fadeOut(2000, showNextQuote);
    }

更具体一点。。。你想摆脱什么循环？在我看来，如果没有循环，它将无法按预期工作。因为我认为我最初编写此代码是作为其他答案的一部分，请描述你试图实现的目标。这段代码的目的是显示交替的引号，其中一个淡出，另一个淡入-永远重复，它将循环使用您在HTML中输入的尽可能多的引号。这就是它设计的目的。如果你有不同的需求，在任何人能够帮助你之前，你必须准确地描述你想要它做什么。现在，你的问题需要以“不清楚你在问什么”的形式结束，除非你能澄清你的问题。我希望它一旦进入第二个引语，就不会消失。对不起，我说得不够具体。