如何使用jQuery在一段时间后更改文本？答案

【问题标题】：How to change text after time using jQuery?如何使用jQuery在一段时间后更改文本？
【发布时间】：2015-02-14 01:50:42
【问题描述】：

我在 stackoverflow HERE 上找到了这段代码，但它对我不起作用...

我只能看到这个：

Hello world!
Here is a message:

，但我看不到应该在一段时间后更改的消息...

我从我的文件 index.html 复制/粘贴整个代码：

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">


</script>
</head>
<body>
<script type="text/javascript">
function nextMsg() {
    if (messages.length == 0) {
        alert("redirecting");
    } else {
        $('#message').html(messages.pop()).fadeIn(500).delay(1000).fadeOut(500,     nextMsg);
    }
};

var messages = [
    "Hello!",
    "This is a website!",
        "You are now going to be redirected.",
    "Are you ready?",
    "You're now being redirected..."
].reverse();

$('#message').hide();
nextMsg();
</script>

<h1>Hello world!</h1>
<p>Here is a message: <span id="message"></span></p>
</body>
</html>

提前致谢:)

【问题讨论】：

将所有内容包装到 document.ready()
^ 那-> jsfiddle.net/fbd02x33
在调试控制台中查看，相同的代码在这里jsfiddle.net/5s8y3/1 并且效果很好。

标签： javascript php jquery html css

【解决方案1】：

只需更改顺序不要在代码开头始终执行 javascript 和/或使用文档准备好确保在执行 js 之前加载 dom

<h1>Hello world!</h1>
    <p>Here is a message: <span id="message"></span></p>

<script>
     $(document).ready(function() {
function nextMsg() {
    if (messages.length == 0) {
        alert("redirecting");
    } else {
        $('#message').html(messages.pop()).fadeIn(500).delay(1000).fadeOut(500,nextMsg);
    }
};


var messages = [
    "Hello!",
    "This is a website!",
        "You are now going to be redirected.",
    "Are you ready?",
    "You're now being redirected..."
].reverse();

$('#message').hide();
nextMsg();
});
</script>

【讨论】：