When I give the command:
$(window).load(function(){
console.log('Site totalmente carregado!');
});
It works correctly, the message in the console only appears when the window has been fully loaded.
But for example, how do I check if this (window).load() is false?
When I use:
while(!$(window).load()){
console.log('Carregando...');
}
It kind of does not give the command false. Why?
I usually do this simply without jQuery like this:
function domReady(cb) {
(function checkDomReady() {
var state = document.readyState;
if (state == 'loaded' || state == 'complete') cb();
else setTimeout(checkDomReady, 200);
})();
};
domReady(function() {
console.log('a página já carregou!');
}); The idea is to have a function that calls itself until the page has changed state. This logic allows you to call domReady multiple times from different sites. The function that is passed to domReady is called when the page has status loaded or complete .
To have a loader, you just add a class to a DOM element that is taken out of the function passed to domReady .
For example like this:
document.body.classList.add('a-carregar');
setTimeout(() => {
document.body.classList.remove('a-carregar');
}, 3000);body.a-carregar {
background-color: rgba(0, 0, 0, .4);
pointer-events: none;
} Method load has the following parameters .load( url [, data ] [, complete ] )
Running example
$( "#success" ).load( "/not-here.php", function( response, status, xhr ) {
if ( status == "error" ) {
var msg = "Ocorreu o seguinte erro ";
$( "#error" ).html( msg + xhr.status + " " + xhr.statusText );
}
});
As you can see, error is equivalent to false in load , it means that it was not possible to request such information. If you want to follow the process use beforeSend in a request ajax ...
$.ajax({
url: url,
dataType: "json",
beforeSend: function(){
$('.loading').html('Carregando...');
}
});
There are two .load in JQuery. The first, which you can see here is an event handler for the JavaScript "load" event. It is called when a component and all its subcomponents are fully loaded. This method was deprecated from JQuery 1.8 and removed from JQuery 3.0.
The other .load method, which can be seen here , is a method of the Ajax module responsible for loading an HTML from a server and put the content in the component where the method was called. Before the first deprecated , JQuery knew which method was being called according to the parameters entered.
None of these methods simply return true or false as you're looking for (the first .load quoted returns a JQuery object). What you can do is put the code you want to run after the entire page is loaded into the .ready() function:
$(document).ready(function(){
// fazer alguma coisa
});
Everything outside this method will run before the page is fully loaded.