Jak wykonać kod jQuery PO załadowaniu strony?

Jeśli chcesz, aby zdarzenie działało na Twojej stronie, powinieneś wywołać je wewnątrz funkcji $ (document) .ready (). Wszystko w nim zostanie załadowane, gdy tylko zostanie załadowany DOM, a przed załadowaniem zawartości strony.

Chcę robić kod javascript dopiero po załadowaniu zawartości strony. Jak mogę to zrobić?

Użyj loadzamiast ready:

$(document).load(function () {
 // code here
});

Aktualizacja Musisz używać .on()od wersji jQuery 1.8. ( http://api.jquery.com/on/ )

$(window).on('load', function() {
 // code here
});

Z tej odpowiedzi :

Według http://blog.jquery.com/2016/06/09/jquery-3-0-final-released/ :

Usunięto przestarzałe aliasy zdarzeń

.load, .unloadi .errorprzestarzałe od wersji jQuery 1.8 nie są już używane. Służy .on()do rejestrowania słuchaczy.

https://github.com/jquery/jquery/issues/2286

Następujący

$(document).ready(function() { 
});

może być zastąpiony

$(window).bind("load", function() { 
     // insert your code here 
});

Jeszcze raz używam sposobu, aby zwiększyć czas ładowania strony.

$(document).ready(function() { 
  $(window).load(function() { 
     //insert all your ajax callback code here. 
     //Which will run only after page is fully loaded in background.
  });
});

nikt o tym nie wspomniał

$(function() {
    // place your code
});

który jest skróconą funkcją

$(document).ready(function() { .. });

Edycja: ten kod będzie czekał, aż cała zawartość (obrazy i skrypty) zostanie w pełni załadowana i wyrenderowana w przeglądarce.

Miałem ten problem, $(window).on('load',function(){ ... })który powodował zbyt szybkie uruchamianie mojego kodu, ponieważ JavaScript, którego użyłem, służył do formatowania i ukrywania elementów. Elementy zostały zbyt wcześnie ukryte i pozostawione z wysokością 0.

Teraz używam $(window).on('pageshow',function(){ //code here });i odpala w czasie, którego potrzebuję.

W ten sposób możesz uniknąć niezdefiniowania w „$”

window.addEventListener("DOMContentLoaded", function(){
    // Your code
});

EDYCJA: Używanie „DOMContentLoaded” jest szybsze niż tylko „ładowanie”, ponieważ strona oczekiwania na załadowanie jest w pełni załadowana, wraz z obrazami ... podczas gdy DomContentLoaded czeka tylko na strukturę

Szukam tego samego problemu i oto co mi pomoże. Oto wersja jQuery 3.1.0, a zdarzenie load jest przestarzałe do użytku od wersji jQuery 1.8 . Zdarzenie load jest usuwane z jQuery 3.0. Zamiast tego możesz użyć metody on i powiązać zdarzenie ładowania JavaScript:

$(window).on('load', function () {
  alert("Window Loaded");
});

A jeśli chcesz uruchomić drugą funkcję po zakończeniu pierwszej, zobacz odpowiedź dotyczącą przepełnienia stosu .

napisz kod, który chcesz w nim wykonać. Gdy dokument będzie gotowy, zostanie to wykonane.

$(document).ready(function() { 

});