jquery中的Window onload事件未触发
jquery中的Window onload事件未触发
提问于 2019-10-29 08:37:09
为什么window onload在下面的代码中没有触发。有没有什么方法可以在文档就绪事件中加载HTML？实际上，我想在页面开始加载时显示预加载器，并在文档完全加载后删除加载器。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
// executes when HTML-Document is loaded and DOM is ready
alert("document is ready");
$(window).load(function() {
// executes when complete page is fully loaded, including all frames, objects and images
alert("window is loaded");
});
});
</script>
</head>
<body>
<div id="load"></div>
<div id="contents">
<p>test</p>
</div>
</body>
</html>回答 2
Stack Overflow用户
发布于 2019-10-29 09:05:34
首先在css中隐藏内容div，然后在javascript中隐藏加载程序div，完成后显示内容div。
演示：
https://codepen.io/perodo/pen/bGGrOra
代码源：
<style>
#load {
display: inline-block;
width: 30px;
height: 30px;
position: absolute;
z-index:3;
border: 4px solid #Fff;
top: 50%;
z-index:1;
}
#contents{
height: 100%;
width:100%;
text-align: center;
background:#dcdcdc;
margin:0;
padding:0;
position:relative;
display:none;
}
</style>
<div id="load">loading...</div>
<div id="contents">
<p>test</p>
</div>
<script>
$(window).load(function() {
$("#load").delay(2000).fadeOut("slow", function(){
$("#contents").fadeIn("slow");
});
});
</script>Stack Overflow用户
发布于 2019-10-29 10:37:48
尝试以下代码：
<script>
$(document).ready(function() {
// executes when HTML-Document is loaded and DOM is ready
alert("document is ready");
});
$(window).on('load', function () {
alert("Window Loaded");
});
</script>希望这能起作用！！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58603806
复制相关文章
相似问题
腾讯云开发者
