javascript 文档就绪与窗口加载 - 未定义不是函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29460049/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Document Ready vs Window Onload - undefined is not a function
提问by Hyman
I'm adding a small initialization function to the beginning of my script to pop up a login dialog, and I initially wanted to do it once the window was loaded, so I attempted to use the following code:
我在脚本的开头添加了一个小的初始化函数来弹出一个登录对话框，我最初想在窗口加载后执行它，所以我尝试使用以下代码：
$( window ).onload(function() {
console.log("foo");
});
However, it always returned
然而，它总是返回
Uncaught TypeError: undefined is not a function
未捕获的类型错误：未定义不是函数
I decided to use the following code instead, and it works fine:
我决定改用以下代码，它工作正常：
$( document ).ready(function() {
console.log("foo");
});
I have absolutely no problem using document ready to achieve my goals, I was just wondering why window onload would not work.
我使用准备好的文档来实现我的目标绝对没有问题，我只是想知道为什么窗口加载不起作用。
回答by thecotne
$( window ).onload(function() {
console.log("foo");
});
is incorrect
是不正确的
correct will be
正确将是
window.onload = function() {
console.log("foo");
};
or
或者
$( window ).load(function() {
console.log("foo");
});
or
或者
$( window ).on('load', function() {
console.log("foo");
});
----- edit -----
- - - 编辑 - - -
if you are using jQuery i would recommend "ready" function
如果您使用 jQuery，我会推荐“就绪”功能
$( document ).ready(function() {
console.log("foo");
});
or short version
或简短版本
$(function() {
console.log("foo");
});
回答by Mackan
I think you mean window.onload, that is a javascript event
我想你的意思是window.onload，这是一个 javascript 事件
window.onload = function(){
// x functionality when window loads
}
$(window).loadis a similar event in jQuery. $(document).readyis jQuery for when the DOM is ready and loaded.
$(window).load是 jQuery 中的一个类似事件。$(document).ready是当 DOM 准备好并加载时的 jQuery。
For a bit of trivia: The $(document).readyis actually the first of the above events to fire, as this doesn't wait for images (etc.). It fires directly after the DOM has loaded. The other two wait until the whole page is loaded.
对于一些琐事：$(document).ready实际上是上述事件中的第一个触发，因为它不等待图像（等）。它在 DOM 加载后直接触发。另外两个等到整个页面加载完毕。
回答by Vitaliy Terziev
window.onload = function() {
};
this is not jQuery
这不是 jQuery
回答by Sourabh Pant
Window.load fires when everything in the page has finished loading. That means that not only the entire DOM is loaded, but any linked resources such as images are fully loaded. Because this waits for images to finish loading, it can sometimes take a long time to fire.
Window.load 在页面中的所有内容都完成加载时触发。这意味着不仅加载了整个 DOM，而且所有链接的资源（例如图像）都已加载完毕。因为这会等待图像完成加载，所以有时需要很长时间才能触发。
See the below code which will fire the window load event after the image load function so you can use the document.ready event if you want to intervene "early" in the rendering process, without waiting for the images to load.
请参阅下面的代码，该代码将在图像加载函数之后触发窗口加载事件，因此如果您想在渲染过程中“尽早”干预，而无需等待图像加载，则可以使用 document.ready 事件。
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("img").load(function(){
alert("Image loaded.");
});
});
$(window).load(function(){
alert('load my window when all the resources on the page is loaded');
});
</script>
<html>
<head>
</head>
<body>
<img src="img_moustiers-sainte-marie.jpg" alt="Cinqueterra" width="304" height="236">
<p><b>Note:</b> Depending on the browser, the load event may not trigger if the image is cached.</p>
</body>
</html>
