gpt4 book ai didi

jquery - 如何使用 jQuery 在时间后更改文本?

转载 作者:太空狗 更新时间:2023-10-29 16:50:51 26 4
gpt4 key购买 nike

我以前从未使用过 jQuery,我想问一下如何做一些对你们来说似乎很简单的事情。我环顾四周,但找不到答案。

好吧,假设我有一个 HTML 文档;

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>
<body>
<h1>Hello world!</h1>
<p>Here is a message: <span id="message"></span></p>
</body>
</html>

我想问的是如何创建一个字符串列表,当页面加载时显示第一个,并在指定时间的随机间隔后更改为下一个,依此类推,也许大约5 条消息后,它将用户重定向到另一个页面。

如果我的消息是:

Hello!
This is a website!
You are now going to be redirected.
Are you ready?
You're now being redirected...

在我的真实站点中,如果消息可以对用户隐藏(在页面上,但在 css/js 文件中它会很好)并且它有一种很好的淡入淡出效果,那就太好了消息进来了。

有人可以向我解释一下这是如何工作的吗?

我想补充一点,我没有使用 jQuery 的经验(只有一点点 JavaScript),而且我不知道脚本/函数的位置。有人可以告诉我怎么做,或者链接到向我展示此内容的初学者指南吗?

最佳答案

这是一种方法(jsfiddle demo):

function nextMsg() {
if (messages.length == 0) {
// once there is no more message, do whatever you want
alert("redirecting");
} else {
// change content of message, fade in, wait, fade out and continue with next message
$('#message').html(messages.pop()).fadeIn(500).delay(1000).fadeOut(500, nextMsg);
}
};
// list of messages to display
var messages = [
"Hello!",
"This is a website!",
"You are now going to be redirected.",
"Are you ready?",
"You're now being redirected..."
].reverse();

// initially hide the message
$('#message').hide();

// start animation
nextMsg();

稍微修改一下,您应该能够自定义每条消息的间隔。

关于jquery - 如何使用 jQuery 在时间后更改文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8630722/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com