0

我试图让它在现场环境中工作：http: //jsfiddle.net/LREwC/

这是我设置的测试 HTML 页面：

<head>
<title>1</title>
<link href="/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/js/jquery-1.8.3.js"></script>
</head>
<body>
<script type="text/javascript">
(function() {

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

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

    showNextQuote();

})();
</script>
<p class="quotes">first quote</p>
<p class="quotes">second quote</p>
<p class="quotes">third quote</p>
</body>

出于某种原因，它不能在实时环境中工作，但在 JSfiddle 中可以正常工作。我在发布代码时做错了吗？

CSS 和 JS 脚本文件已正确链接。我现场测试了链接，我只是缩短了它，所以它没有链接到我正在处理的网站。

4

1 回答 1

0

您必须等待所有 dom 元素准备就绪：

jQuery(function($) {

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

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

    showNextQuote();

});

另一种选择是将脚本移动到文档的末尾。

于 2013-08-26T17:31:53.680 回答