Quali tipi di eventi (eventi) esistono?

Esistono molti tipi di eventi, ma i più comuni possono essere raggruppati in categorie:

• Eventi dell'interfaccia utente:

  • click: Clic del mouse su un elemento.
  • dblclick: Doppio clic del mouse su un elemento.
  • mousedown: Pressione del pulsante del mouse (prima di rilasciarlo).
  • mouseup: Rilascio del pulsante del mouse.
  • mousemove: Movimento del puntatore del mouse su un elemento.
  • mouseover: Passaggio del puntatore del mouse su un elemento.
  • mouseout: Uscita del puntatore del mouse da un elemento.
  • mouseenter: Il puntatore del mouse entra in un elemento (non si propaga dai figli).
  • mouseleave: Il puntatore del mouse esce da un elemento (non si propaga dai figli).
  • contextmenu: Visualizza il menu contestuale con il tasto destro del mouse.

• Eventi della tastiera:

  • keydown: Tasto premuto (prima di rilasciarlo).
  • keyup: Tasto rilasciato.
  • keypress: Tasto premuto e mantenuto, generando dati di input di caratteri. (Obsoleto, si consiglia di usare keydown e keyup).

• Eventi del modulo:

  • submit: Invio di un modulo.
  • change: Modifica del valore di un elemento del modulo (ad esempio, <input>, <select>, <textarea>).
  • input: Modifica del valore di un elemento del modulo quando il suo contenuto cambia in modo interattivo.
  • focus: L'elemento riceve il focus.
  • blur: L'elemento perde il focus.
  • cut: Taglia il contenuto.
  • copy: Copia il contenuto.
  • paste: Incolla il contenuto.

• Eventi di caricamento e errore:

  • load: Completamento del caricamento di una risorsa (ad esempio, immagine, script, pagina).
  • unload: Uscita dalla pagina.
  • beforeunload: Tentativo di lasciare la pagina (consente di mostrare una finestra di dialogo di conferma).
  • error: Si è verificato un errore durante il caricamento di una risorsa o l'esecuzione di uno script.

• Eventi di focus (FocusEvent):

  • focusin: L'elemento o uno dei suoi figli riceve il focus.
  • focusout: L'elemento o uno dei suoi figli perde il focus.

• Eventi di scorrimento:

  • scroll: Scorrimento di un elemento.

• Eventi touch (per dispositivi touch):

  • touchstart: Il dito tocca lo schermo.
  • touchend: Il dito si solleva dallo schermo.
  • touchmove: Il dito si muove sullo schermo.
  • touchcancel: Evento di tocco interrotto (ad esempio, a causa di chiamate al menu di sistema).

• Eventi di trascinamento (Drag and Drop):

  • dragstart: Inizio del trascinamento.
  • drag: L'elemento viene trascinato.
  • dragend: Fine del trascinamento.
  • dragenter: L'elemento è stato trascinato sopra una zona di rilascio valida.
  • dragleave: L'elemento è stato trascinato fuori da una zona di rilascio valida.
  • dragover: L'elemento è stato trascinato sopra una zona di rilascio valida (richiede di annullare il comportamento predefinito per consentire il rilascio).
  • drop: L'elemento è stato rilasciato su una zona di rilascio valida.

• Eventi della cronologia del browser:

  • popstate: Cambiamento nella voce attiva della cronologia durante la navigazione (ad esempio, cliccando sul pulsante "Indietro/Avanti").

• Eventi di ridimensionamento della finestra:

  • resize: Cambiamento delle dimensioni della finestra del browser.

Questa non è una lista esaustiva, ma copre i tipi di eventi più frequenti e importanti nello sviluppo web. Comprendere il loro scopo e comportamento è fondamentale per creare applicazioni web interattive.