Se você quiser que um evento funcione em sua página, você deve chamá-lo dentro da função $ (document) .ready (). Tudo dentro dele será carregado assim que o DOM for carregado e antes que o conteúdo da página seja carregado.
Eu quero fazer código javascript somente depois que o conteúdo da página for carregado, como posso fazer isso?
$(document).on('load', ...
que precisa ser$(window).on('load',...
Segue
$(document).ready(function() { });
pode ser substituído
$(window).bind("load", function() { // insert your code here });
Existe mais uma forma que estou usando para aumentar o tempo de carregamento da página.
$(document).ready(function() { $(window).load(function() { //insert all your ajax callback code here. //Which will run only after page is fully loaded in background. }); });
fonte
ninguém mencionou isso
$(function() { // place your code });
que é uma função abreviada de
$(document).ready(function() { .. });
fonte
Editar: Este código irá esperar até que todo o conteúdo (imagens e scripts) seja totalmente carregado e renderizado no navegador.
Eu tive este problema onde
$(window).on('load',function(){ ... })
dispararia muito rápido para o meu código, uma vez que o Javascript que usei era para fins de formatação e ocultar elementos. Os elementos foram ocultados muito cedo e foram deixados com uma altura de 0.Eu agora uso
$(window).on('pageshow',function(){ //code here });
e ele dispara na hora que preciso.fonte
Você pode evitar ficar indefinido em '$' desta forma
window.addEventListener("DOMContentLoaded", function(){ // Your code });
EDIT: Usar 'DOMContentLoaded' é mais rápido do que apenas 'carregar' porque a página de espera de carga está totalmente carregada, imgs incluídos ... enquanto DomContentLoaded espera apenas a estrutura
fonte
Estou procurando o mesmo problema e aqui está o que me ajuda. Aqui está o jQuery versão 3.1.0 e o evento de carregamento está obsoleto para uso desde o jQuery versão 1.8 . O evento de carregamento é removido do jQuery 3.0. Em vez disso, você pode usar o método on e vincular o evento de carregamento do JavaScript:
$(window).on('load', function () { alert("Window Loaded"); });
fonte
E se você quiser executar uma segunda função após o término da primeira, consulte esta resposta stackoverflow .
fonte
escreva o código que deseja executar dentro dele. Quando seu documento estiver pronto, ele será executado.
$(document).ready(function() { });
fonte