Cosa significa $ (function () {}); fare?


208

A volte creo una funzione e la chiamo più tardi.

Esempio:

function example { alert('example'); }
example(); // <-- Then call it later

In qualche modo, alcune funzioni non possono essere chiamate. Devo chiamare quelle funzioni all'interno:

$(function() { });

Cosa significano $(function() {});e (function() { });significano, e qual è la differenza / scopo di questi?

Risposte:


308
$(function() { ... });

è solo una scorciatoia per jQuery

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

Ciò che è progettato per fare (tra le altre cose) è assicurarsi che la tua funzione venga chiamata quando tutti gli elementi DOM della pagina sono pronti per essere utilizzati.

Tuttavia, non credo sia questo il problema che stai riscontrando: puoi chiarire cosa intendi con "In qualche modo, alcune funzioni non possono essere chiamate e devo chiamare quelle funzioni all'interno"? Forse pubblica un po 'di codice per mostrare cosa non funziona come previsto?

Modifica: rileggi la tua domanda, è possibile che la tua funzione sia in esecuzione prima che la pagina abbia terminato il caricamento e quindi non venga eseguita correttamente; metterlo in $ (funzione) lo risolverebbe davvero!


2
e se $ (function () {}); è già in $ (documento) .ready ()?
jwchang,

la funzione non funziona senza $ (function () sebbene sia già in $ (document) ready ().
jwchang

Buona domanda! Credo che dovrebbe funzionare, dato che jQuery sa che sei nel posto giusto, ma è certamente estraneo; se sei dentro .ready () puoi semplicemente chiamare la tua funzione normalmente. Se non funziona, pubblica un campione o, meglio ancora, prova a creare un violino come jsfiddle.net.
Russ Clarke,

4
@JeongWooChang Fallo così (function () { ... })();. Devi aggiungere ()per invocare la tua funzione.
Šime Vidas,

3
"Gli sviluppatori esperti a volte usano la scorciatoia $()per $( document ).ready(). Se stai scrivendo codice che le persone che non hanno esperienza con jQuery potrebbero vedere, è meglio usare il modulo lungo." - learn.jquery.com
thdoan

15

Quella che segue è una chiamata alla funzione jQuery:

$(...);

Quale è la "funzione jQuery". $è una funzione e la $(...)stai chiamando.

Il primo parametro che hai fornito è il seguente:

function() {}

Il parametro è una funzione specificata e la $funzione chiamerà il metodo fornito al termine del caricamento del DOM.



5

Penso che potresti confondere Javascript con i metodi jQuery. Javascript o vaniglia è qualcosa di simile a:

function example() {
}

Una funzione di quella natura può essere chiamata in qualsiasi momento, ovunque.

jQuery (una libreria basata su Javascript) ha funzioni integrate che generalmente richiedono il rendering completo del DOM prima di essere chiamato. La sintassi per quando questo è completato è:

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

Quindi una funzione jQuery, che ha il prefisso con $la parola o jQuerygeneralmente viene chiamata da quel metodo.

$(document).ready(function() {        
    // Assign all list items on the page to be the  color red.  
    //      This does not work until AFTER the entire DOM is "ready", hence the $(document).ready()
    $('li').css('color', 'red');   
});

Lo pseudo-codice per quel blocco è:

Quando il modello a oggetti del documento $(document)è pronto .ready(), chiamare la seguente funzione function() { }. In quella funzione, controlla tutto <li>sulla pagina $('li')e usa il metodo jQuery .CSS () per impostare la proprietà CSS "color" sul valore "red".css('color', 'red');


2

Questa è una scorciatoia per $(document).ready(), che viene eseguita quando il browser ha terminato il caricamento della pagina (che significa qui "quando il DOM è disponibile"). Vedi http://www.learningjquery.com/2006/09/introducing-document- già . Se stai tentando di chiamare example()prima che il browser abbia terminato il caricamento della pagina, potrebbe non funzionare.


1
"finito di caricare la pagina" è impreciso e fuorviante.
Yahel,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.