OK, torneremo.
Quindi abbiamo un metodo in meno di cui voglio parlare.
Come ho menzionato nel video introduttivo agli eventi di J Korea, il metodo on è quello che useremo.
Il novantanove per cento del tempo è di gran lunga il metodo di evento jay di Jay più utilizzato.
OK.
Quindi parliamo di come funziona è molto simile alla vaniglia.
Sì, un ascoltatore di eventi.
Ovviamente è molto più corto.
Sono solo due personaggi ma si comporta in modo simile dove gli diamo il nome
dell'evento che vogliamo ascoltarlo.
Quindi, a differenza del clic o della pressione di un tasto che si attiva solo su un tipo di evento, un clic o una pressione di
un tasto ci consente di specificare se stiamo facendo un clic come stiamo facendo qui invia al clic o se facciamo un doppio clic come se avessi
qui il tasto con un doppio clic o un trascinamento o una pressione di un tasto in modo che possa prendere il posto di tutte le
cose che hai già visto con clic e pressione dei tasti e tutti gli altri metodi qui.
Ce n'è una tonnellata come scorrere e inviare e attivare la pressione dei tasti verso il basso.
Tutto ciò può essere fatto con il solo metodo on.
Funziona più o meno allo stesso modo anche se dovremmo selezionare prima qualcosa con il simbolo del dollaro.
Quindi ti mostrerò un esempio qui.
Selezioniamo qualcosa in questo caso tutti gli insegnanti all'interno del corpo all'interno di qualcosa con l'idea
della tabella dati e poi lo eseguiamo e quindi il tipo di evento.
Quindi questo è nuovo rispetto al clic e alla pressione dei tasti che accettano solo una funzione di callback.
Dobbiamo specificare quale evento stiamo ascoltando.
Quindi, fare clic in questo caso e quindi virgola la funzione di callback.
Vogliamo essere gestiti.
Quindi proviamo questo per aggiornare la mia pagina.
La mia demo di AJ estratta.
Quindi non abbiamo ascoltatori di clic quindi nessun clic non abbiamo pressioni di tasti.
Nulla accade anche sui nostri pulsanti.
Andiamo e prova ad aggiungere prima alcuni ascoltatori veloci.
Cambiamo il colore dell'H-1 quando clicchiamo su di esso.
Quindi dobbiamo selezionarli tutti e poi faremo sul primo argomento è il tipo di evento che è veloce e
quindi la nostra funzione di callback.
E all'interno della funzione di callback, se volessimo cambiare il colore dell'H-1, potremmo fare qualcosa
di simile in cui diciamo semplicemente H-1 gutsiest a Color Purple e vediamo se riesci a pensare perché questo potrebbe essere un
problema.
Quindi premo invio e funziona bene diventa viola, ma ho intenzione di copiare questo codice e aggiornare la pagina
e ho intenzione di aggiungere in un altro H-1 tre di loro e salvare.
Ora abbiamo tre H-1.
E se eseguo di nuovo questo codice, si dice che qualsiasi H-1 quando si fa clic su di esso cambia tutte le h per essere viola.
Quindi ci proverò.
Cambiano tutti in viola, che forse è una caratteristica che vogliamo ma la maggior parte delle volte vogliamo
influenzare l'elemento su cui clicchiamo.
Quindi, per fare tutto questo, dobbiamo usare la parola chiave this e ricordare che deve essere il wrapper J query
per questo.
Quindi il segno del dollaro parentesi questo e quello si riferisce a quello H-1 o all'unica cosa su cui è stato fatto clic.
E ora, se premo invio, provo a fare clic su solo le modifiche H-1 corrette su viola.
OK, ecco come possiamo usare per fare un clic.
Ora vediamo come usarlo per un tasto stampa.
Quindi selezioneremo il
nostro input come quel punto e poi aggiungeremo key press e il secondo argomento è la funzione di callback e faremo solo un semplice
log di console.
Quindi, cancella il tasto di registro premuto in questo modo e clicchiamo su invio.
Ora se vado a digitare una chiave qui mi preme ogni volta che digito un tasto.
Proviamo un altro tipo di evento qui mi aggiornerò.
Facciamo qualcosa quando passiamo il mouse su un pulsante.
Cambierà il carattere da mettere in grassetto quando passo il mouse.
Quindi dobbiamo prima selezionare tutti i pulsanti proprio così e poi aggiungere il nostro.
E l'evento che useremo si chiama Mouse enter.
Proprio così.
E inizieremo con la registrazione appena cancellata quando il mouse entra.
Quindi faremo un mouse di registro costruito che entra così.
E ora, se passerò il mouse sopra, otterrò un mouse che entra così.
Ed è solo quando entriamo per la prima volta nell'elemento.
Quindi non continua a scatenarsi finché non me ne vado e torno indietro.
OK.
Quindi quando entriamo con il mouse non vogliamo registrare costantemente.
Vogliamo selezionare J wrapper per questo e fare lo stesso SS in grassetto qualcosa che dobbiamo modificare il
peso del font.
Così modi divertenti e faremo quella piega proprio così e premere invio.
Ora, se mi fermo, è difficile vedere che cosa cambia essere audace.
Certo che rimane in grassetto non cambia mai.
facendo la stessa cosa con il pulsante sul mouse che è un altro evento e quindi piuttosto che cambiarlo in peso del font.
Quindi potremmo aggiungere quella caratteristica
Grassetto.
Possiamo riportarlo alla normalità proprio così.
Ora se lo lascio torna alla normalità.
E se entro in grassetto me ne vado, è normale.
Quindi è così che potremmo fare qualcosa con javascript per fare una sorta di effetto di selezione del hover.
Tuttavia con CSSA ora possiamo farlo facilmente senza alcun javascript con lo pseudo-selettore hover.
E volevo solo dimostrare che ci sono altri eventi là fuori.
Quindi tutti gli eventi che potremmo usare con un listener di eventi con cui possiamo usarlo rende
davvero molto utile.
Come ho detto, lo useremo sempre.
Quindi c'è un ultimo punto su cui mi piacerebbe fare e come un esempio che userò.
Clicca e continua.
Fai clic e parla di come sono leggermente diversi.
Quindi entrambi lavoreranno generalmente per te.
che il clic aggiungerà solo gli ascoltatori di clic per gli elementi che si trovano sulla pagina in quel momento.
Aggiungeranno un listener veloce ma c'è una piccola differenza che è
E il clic in su aggiungerà listener per tutti gli elementi futuri o potenziali elementi futuri.
Quindi questo ha senso quando fai la lista delle cose da fare.
Ma fondamentalmente dobbiamo usare il punto sul clic piuttosto che il clic perché dovremo fare ciò che viene aggiunto alla pagina che
non c'è quando la pagina carica un utente digita in un modulo e fa clic su entra.
E ciò renderà una novità da fare e vogliamo che quelli nuovi facciano i propri ascoltatori di clic.
Quindi abbiamo bisogno di ricominciare da capo che avrà più senso quando abbiamo effettivamente iniziato a fare la lista.