In Javascript / jQuery cosa significa (e)?

Sono nuovo di JavaScript / jQuery e ho imparato a fare funzioni. Molte funzioni sono spuntate con (e) tra parentesi. Lascia che ti mostri cosa intendo:

$(this).click(function(e) { // does something }); 

Sembra sempre che la funzione non usi nemmeno il valore di (e), quindi perché è così spesso?

e è il riferimento var breve per l’object event che verrà passato ai gestori di eventi.

L’object evento ha essenzialmente molti metodi e proprietà interessanti che possono essere utilizzati nei gestori di eventi.

Nell’esempio che hai pubblicato è un gestore di clic che è un MouseEvent

 $().click(function(e) { // does something alert(e.type); //will return you click } 

DEMO – Mouse Events DEMO utilizza e.which ed e.type

Alcuni riferimenti utili:

http://api.jquery.com/category/events/

http://www.quirksmode.org/js/events_properties.html

http://www.javascriptkit.com/jsref/event.shtml

http://www.quirksmode.org/dom/events/index.html

http://www.w3.org/TR/DOM-Level-3-Events/#event-types-list

NOTA BENE: Questa è una risposta molto tarda a questo particolare post, ma poiché ho letto varie risposte a questa domanda, mi ha colpito il fatto che la maggior parte delle risposte utilizza una terminologia che può essere compresa solo dai codificatori esperti. Questa risposta è un tentativo di affrontare la domanda originale con un pubblico alle prime armi in mente.

Intro

La piccola cosa ‘ (e) ‘ fa in realtà parte dell’ambito più ampio di qualcosa in Javascript chiamato funzione di gestione degli eventi. Ogni funzione di gestione degli eventi riceve un object evento. Ai fini di questa discussione, pensate a un object come a una “cosa” che contiene un insieme di proprietà ( variabili ) e metodi ( funzioni ), proprio come gli oggetti in altre lingue. La maniglia, la ‘ e ‘ all’interno della piccola (e) cosa, è come una variabile che ti permette di interagire con l’object (e io uso la variabile di termine MOLTO liberamente).

Considera i seguenti esempi di jQuery:

 $("#someLink").on("click", function(e){ // My preferred method e.preventDefault(); }); $("#someLink").click(function(e){ // Some use this method too e.preventDefault(); }); 

Spiegazione

  • “#someLink” è il tuo selettore di elementi (quale tag HTML attiverà questo).
  • “clic” è un evento (quando si fa clic sull’elemento selezionato).
  • “function (e)” è la funzione di gestione degli eventi (su evento, l’object è creato).
  • “e” è il gestore di oggetti (l’object è reso accessibile).
  • “preventDefault ()” è un metodo (funzione) fornito dall’object.

Cosa sta succedendo?
Quando un utente fa clic sull’elemento con ID “#someLink” (probabilmente un tag di ancoraggio), chiama una funzione anonima, “function (e)” , e assegna l’object risultante a un gestore, “e” . Ora prendi il gestore e chiama uno dei suoi metodi, “e.preventDefault ()” , che dovrebbe impedire al browser di eseguire l’azione predefinita per quell’elemento.

Nota: l’handle può essere chiamato praticamente tutto ciò che si desidera (ad esempio ‘ function (billybob) ‘). La ‘e’ sta per ‘evento’, che sembra essere abbastanza standard per questo tipo di funzione.

Sebbene “e.preventDefault ()” sia probabilmente l’uso più comune del gestore di eventi, l’object stesso contiene molte proprietà e metodi a cui è ansible accedere tramite il gestore di eventi.

Alcune informazioni veramente buone su questo argomento sono disponibili sul sito di apprendimento di jQuery, http://learn.jquery.com . Presta particolare attenzione all’utilizzo delle sezioni jQuery Core ed Eventi .

e non ha alcun significato speciale. È solo una convenzione usare e come nome parametro funzione quando il parametro è event .

Può essere

 $(this).click(function(loremipsumdolorsitamet) { // does something } 

anche.

L’argomento e è breve per l’object evento. Ad esempio, potresti voler creare il codice per le ancore che annulla l’azione predefinita. Per fare questo scriverebbe qualcosa come:

 $('a').click(function(e) { e.preventDefault(); } 

Ciò significa che quando si fa clic su un tag , si impedisce l’azione predefinita dell’evento click.

Sebbene tu possa vederlo spesso, non è qualcosa che devi usare all’interno della funzione anche se lo hai specificato come argomento.

In questo esempio, e è solo un parametro per quella funzione, ma è l’object event che viene passato attraverso di esso.

In jQuery e abbreviazione di event , l’object evento corrente. Di solito viene passato come parametro per la funzione evento da triggersre.

Demo: eventi jQuery

Nella demo ho usato e

 $("img").on("click dblclick mouseover mouseout",function(e){ $("h1").html("Event: " + e.type); }); 

Potrei anche aver usato un event

  $("img").on("click dblclick mouseover mouseout",function(event){ $("h1").html("Event: " + event.type); }); 

Stessa cosa!

I programmatori sono pigri, usiamo molto stenografia, in parte diminuisce il nostro lavoro, in parte è utile per la leggibilità. Comprensione che ti aiuterà a capire la mentalità della scrittura del codice.

Oggi ho appena scritto un post su “Perché usiamo le lettere come” e “in e.preventDefault ()?” e penso che la mia risposta avrà un senso …

Inizialmente, vediamo la syntax di addEventListener

Normalmente sarà: target.addEventListener (type, listener [, useCapture]);

E la definizione dei parametri di addEventlistener sono:

type : una stringa che rappresenta il tipo di evento da ascoltare.

listener : l’object che riceve una notifica (un object che implementa l’interfaccia Event) quando si verifica un evento del tipo specificato. Questo deve essere un object che implementa l’interfaccia EventListener o una funzione JavaScript.

(Da MDN)

Ma penso che ci sia una cosa da sottolineare: quando usi la funzione Javascript come listener, l’object che implementa l’interfaccia Event (object object) verrà automaticamente assegnato al “primo parametro” della funzione. Quindi, se usi funzione (e), l’object sarà assegnato a “e” perché “e” è l’unico parametro della funzione (sicuramente il primo!), quindi è ansible utilizzare e.preventDefault per evitare qualcosa ….

proviamo l’esempio come di seguito:

 

Please click on the checkbox control.

il risultato sarà: [object MouseEvent] 5 e impedirai l’evento click.

ma se togli il segno di commento come:

  

otterrai: 8 e un errore : “Uncaught TypeError: e.preventDefault non è una funzione su HTMLInputElement. (VM409: 69)”.

Certamente, l’evento click non verrà prevenuto questa volta. Perché la “e” è stata nuovamente definita nella funzione.

Tuttavia, se si modifica il codice in:

  

ogni cosa funzionerà di nuovo bene … ne otterrete 8 e l’evento click sarà prevenuto

Pertanto, “e” è solo un parametro della tua funzione e hai bisogno di una “e” nella tua funzione () per ricevere l'”object evento”, quindi eseguire e.preventDefault (). Questo è anche il motivo per cui puoi cambiare la “e” con qualsiasi parola che non è riservata da js.

È un riferimento all’object evento corrente