Kiedy powinienem użyć dokumentu jQuery.gotowa funkcja?

Odpowiedzi:

JQuery ' s .metoda on (): używam .metoda on () dla AJAX (dynamiczne tworzenie elementów DOM). Powinien .on () click handlers zawsze bądź wewnątrz dokumentu.gotowy?

Wydajność: czy jest bardziej wydajne, aby zachować różne javascript / jQuery obiekty wewnątrz lub na zewnątrz dokumentu.ready (również, czy różnica w wydajności jest znacząca?)?

Zakres obiektu: Strony załadowane Ajaxem nie mają dostępu do obiektów znajdujących się wewnątrz dokument poprzedniej strony.gotowy, zgadza się? Mają dostęp tylko do obiektów które były poza dokumentem.gotowe (czyli prawdziwie "globalne" obiekty)?

Jest w zasadzie własną funkcją, więc może uzyskać dostęp tylko do zmiennych zadeklarowanych w globalnym zasięgu (poza / ponad wszystkimi funkcjami) lub z window.myvarname = '';

Zanim będziesz mógł bezpiecznie korzystać z jQuery, musisz upewnić się, że strona jest w stanie, w którym jest gotowa do manipulacji. Dzięki jQuery osiągamy to poprzez umieszczenie naszego kodu w funkcji, a następnie przekazanie tej funkcji do $(document).ready(). Funkcja, którą przekazujemy może być po prostu funkcją anonimową .

$(document).ready(function() {  
    console.log('ready!');  
});

To uruchomi funkcję, którą przekazujemy .ready() gdy dokument jest gotowy. Co tu się dzieje? Używamy $(document) do utworzenia obiektu jQuery z naszego dokument page' a, a następnie wywołanie .funkcja ready () na tym obiekcie, przekazując jej funkcję, którą chcemy wykonać.

Ponieważ jest to coś, co często robisz, istnieje na to metoda skrótu, jeśli wolisz - funkcja $ () pełni podwójną funkcję jako alias dla $(document).ready() jeśli przekażesz mu funkcję:

$(function() {  
    console.log('ready!');  
});  

To jest dobra lektura: jQuery Fundamentals

.gotowe() - określa funkcję do wykonania, gdy DOM jest w pełni załadowany.

$(document).ready(function() {
  // Handler for .ready() called.
});

Oto lista wszystkie metody jQuery

Czytaj dalej przedstawiamy $(dokument).gotowe()

Aby być realistycznym, document.ready nie jest potrzebny do niczego innego niż dokładne manipulowanie DOM i nie zawsze jest potrzebny lub najlepszym rozwiązaniem. Chodzi mi o to, że kiedy rozwijasz dużą wtyczkę jQuery, na przykład, prawie nie używasz jej w całym kodzie, ponieważ próbujesz utrzymać ją suchą, więc abstrakujesz jak najwięcej w metodach, które manipulują domem, ale mają być wywoływane później. Gdy cały kod jest ściśle zintegrowany, jedyną metodą document.ready jest zwykle init, gdzie cała magia DOM się zdarza. Mam nadzieję, że to odpowie na twoje pytanie.

Należy powiązać wszystkie działania w dokumencie.gotowe, ponieważ należy poczekać aż dokument zostanie w pełni załadowany.

Należy jednak utworzyć funkcje dla wszystkich akcji i wywołać je z poziomu dokumentu.gotowy. Gdy tworzysz funkcje (obiekty globalne), wywołaj je, kiedy tylko chcesz. Po załadowaniu nowych danych i utworzeniu nowych elementów ponownie wywołaj te funkcje.

Te funkcje są tymi, w których zostały powiązane zdarzenia i elementy akcji.

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

function bindelement1(){
$('el1').on('click',function...);
//you might make an ajax call here, then under complete of the AJAX, call this function or any other function again
}

function bindelement2(){
$('el2').on('click',function...);
}

Dodałem link do div I chciałem wykonać kilka zadań po kliknięciu. Dodałem kod pod dołączonym elementem w DOM, ale nie zadziałał. Oto kod:

<div id="advance-search">
   Some other DOM elements
   <!-- Here I wanted to apppend the link as <a href="javascript:;" id="reset-adv-srch"><span class="bold">x</span> Clear all</a>-->
</div>

<script>
  $("#advance-search #reset-adv-srch").on("click", function (){
     alert('Link Clicked');``
  });
</script>

$(document).ready(function(e) {
    $("#advance-search #reset-adv-srch").on("click", function (){
        alert('Link Clicked');
    });
});

Zdarzenie he ready występuje po załadowaniu DOM (document object model).

Ponieważ to zdarzenie występuje po przygotowaniu dokumentu, jest to dobre miejsce, aby mieć wszystkie inne zdarzenia i funkcje jQuery. Jak w powyższym przykładzie.

Metoda ready() określa, co się stanie, gdy wystąpi zdarzenie ready.

Wskazówka: metoda ready() nie powinna być używana razem z .