Question

我试图在5秒后让一个div淡出，然后用JQuery显示一个新的div。

    <script>
$(document).ready(function(){
    function hidehero(){
        $("#hero").fadeOut();
    };
    function showmain(){
        $("main").show();
    };
    function timeouts(){
        setInterval(hidehero(), 3000);
        setInterval(showmain(), 5000);
    };
    timeouts();
});

不幸的是，第一个div立即消失，新的div立即出现，并且没有听到间隔。

如果有人知道如何解决这个问题，请告诉我！

Answer 1

更改

setInterval(hidehero(), 3000);
setInterval(showmain(), 5000);

使用：

//Pass the function, not the return value of the function.
setInterval(hidehero, 3000);
setInterval(showmain, 5000);

你正在立即调用这个函数，这就是为什么它没有按预期工作。 setInterval将function作为其第一个参数，并且您传递undefined，因为hidehero函数不会返回任何内容。

顺便说一下，你应该使用setTimeout而不是setInterval，在你的代码中，不需要每3秒钟调用一次hidehero。

您的showmain功能也有误，因为您在#中遗漏了$("main")。要在jQuery中引用ID，请使用$("#main")

这是一个有效的演示：

$(document).ready(function() {
	function hidehero() {
		$("#hero").fadeOut();
	};

	function showmain() {
		$("#main").show();
	};

	function timeouts() {
		setTimeout(hidehero, 3000);
		setTimeout(showmain, 5000);
	};
	timeouts();
});

<!DOCTYPE html>

<html>
<head>
    <title>Sevi Home</title>
    <link rel="shortcut icon" type="image/png"  href="favicon.ico" />
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="css.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
    
    </script>
</head>

<body>

<div id="hero">
    <div class="header">SEVI<br></div>
</div>
<div id="main" style="display:none"><div class="header2">ELLO!!!!!!</div></div>
</body>
</html>

Answer 2

更改setTimeout（）的setInterval（），它将起作用。

Answer 3

试试这个：

$(document).ready(function(){
    setTimeout(function() {
        $("#hero").fadeOut(function() {
            $("#main").show();
        });
    }, 5000);
});

设置fadeout / show jquery的间隔

3 个答案: