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.
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.
Share Improve this question edited Apr 5, 2015 at 17:26 Rahil Wazir 10.1k11 gold badges44 silver badges65 bronze badges asked Apr 5, 2015 at 17:22 JackJack 391 gold badge1 silver badge4 bronze badges 2 |4 Answers
Reset to default 15$( 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
$( document ).ready(function() {
console.log("foo");
});
or short version
$(function() {
console.log("foo");
});
I think you mean window.onload, that is a javascript event
window.onload = function(){
// x functionality when window loads
}
$(window).load is a similar event in jQuery. $(document).ready is jQuery for when the DOM is ready and loaded.
For a bit of trivia: The $(document).ready is 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.
window.onload = function() {
};
this is not jQuery
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.
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.
<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>
onloadmethod. Can useon('load')orload()– charlietfl Commented Apr 5, 2015 at 17:24$(window).load(function(){})function for jquery – Muhammad Haseeb Khan Commented Apr 5, 2015 at 17:25