Latest web development tutorials
×

JavaScript corso

JavaScript corso JavaScript breve introduzione JavaScript uso JavaScript esportazione JavaScript grammatica JavaScript dichiarazioni JavaScript nota JavaScript variabile JavaScript Tipi di dati JavaScript Oggetti JavaScript funzione JavaScript portata JavaScript evento JavaScript stringa JavaScript operatori JavaScript confrontare JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript tipo di conversione JavaScript Espressioni regolari JavaScript errore JavaScript Debugging JavaScript alzata variabile JavaScript Modalità Strict JavaScript Uso improprio JavaScript Forms Authentication JavaScript Parole chiave riservate JavaScript JSON JavaScript void JavaScript Codice Specifica

JS funzione

JavaScript definizione di funzione JavaScript Argomenti funzione JavaScript richiamo della funzione JavaScript chiusure

JS HTML DOM

DOM breve introduzione DOM HTML DOM CSS DOM evento DOM EventListener DOM elemento

JS Tutorial avanzato

JavaScript Oggetti JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp Oggetti

JS Browser BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript pop JavaScript evento programmato JavaScript Cookies

JS magazzino

JavaScript magazzino JavaScript prova jQuery JavaScript prova Prototype

JS Esempi

JavaScript Esempi JavaScript istanza di oggetto JavaScript istanza di oggetto Browser JavaScript HTML DOM Esempi JavaScript sommario

JS Manuale di riferimento

JavaScript Oggetti HTML DOM Oggetti

evento JavaScript HTML DOM

HTML DOM JavaScript, HTML ha la capacità di reagire agli eventi.

Esempi

Mouse Over Me
Clicca Me


Reagire agli eventi

Siamo in grado di eseguire JavaScript quando si verifica l'evento, come ad esempio quando l'utente fa clic sull'elemento HTML.

Per eseguire il codice quando un utente fa clic su un elemento, aggiungere un codice JavaScript per attribuisce l'evento HTML:

onclick= JavaScript

Esempi di eventi HTML:

  • Quando l'utente fa clic con il mouse
  • Quando la pagina viene caricata
  • Quando l'immagine è caricata
  • Quando il mouse si muove sopra l'elemento
  • Quando il campo di input viene modificato
  • Quando si invia un modulo HTML
  • Quando l'utente attiva il tasto

In questo esempio, quando un utente sull'elemento <h1> se cliccato, cambierà il suo contenuto:

Esempi

<! DOCTYPE html>
<HTML>
<Body>
<H1 onclick = "this.innerHTML = 'Ops!'"> Fare clic sul testo! </ H1>
</ Corpo>
</ Html>

Prova »

In questo caso, per chiamare una funzione dal gestore di eventi:

Esempi

<! DOCTYPE html>
<HTML>
<Head>
<Script>
Funzione ChangeText (id)
{
id.innerHTML = "Ops!";
}
</ Script>
</ Head>
<Body>
<H1 onclick = "ChangeText (questo)"> cliccare sul testo! </ H1>
</ Corpo>
</ Html>

Prova »


HTML evento Attributi

Per assegnare gli eventi agli elementi HTML, è possibile utilizzare gli attributi di evento.

Esempi

Assegnato per l'evento onclick elemento pulsante:

<Button onclick = "displayDate () "> Clicca qui </ button>

Prova »

Nell'esempio precedente, la funzione denominata displayDate verrà eseguita quando il pulsante viene premuto.


Utilizzare il DOM HTML per assegnare un evento

HTML DOM consente di utilizzare JavaScript per assegnare gli eventi agli elementi HTML:

Esempi

Assegnato per l'evento onclick elemento pulsante:

<Script>
. Document.getElementById ( "myBtn") onclick = function () {displayDate ()};
</ Script>

Prova »

Nell'esempio precedente, la funzione viene assegnata ad un id = myButn "elemento HTML displayDate nome.

Fare clic sul pulsante quando verrà eseguita la funzione Javascript.


onLoad ed evento onunload

onLoad e onunload evento viene attivato quando l'utente entra o esce dalla pagina.

evento onload può essere utilizzato il tipo di browser e la versione del browser viene rilevato il visitatore, e sulla base di queste informazioni per caricare la versione corretta della pagina.

onLoad e l'evento onunload può essere utilizzato per gestire biscotto.

Esempi

<Body onload = "checkCookies () ">

Prova »


evento onchange

onchange evento spesso in combinazione convalida campo di input da utilizzare.

Ecco un esempio di come utilizzare il onchange. Quando l'utente modifica il contenuto del campo di inserimento, chiama la funzione maiuscole ().

Esempi

<Input type = "text" id = "fname" onchange = "maiuscole ()">

Prova »


onmouseover e onmouseout eventi

onmouseover e onmouseout eventi possono essere utilizzati per attivare funzioni quando il mouse si muove dell'utente alla parte superiore dell'elemento HTML o elementi rimossi.

Esempi

Un semplice esempio onmouseover-onmouseout:

Mouse Over Me

Prova »


onMouseDown, onmouseup ed evento onclick

onMouseDown, onmouseup e onclick costituiscono tutte le parti del evento clic del mouse. In primo luogo, quando si fa clic sul pulsante del mouse, il trigger onMouseDown evento quando il pulsante del mouse viene rilasciato, si innescherà onmouseup evento, e, infine, quando il completamento di un clic del mouse, si attiva l'evento onclick.

Esempi

Un semplice esempio onmousedown-onmouseup:

Grazie


Altri esempi

onMouseDown e onmouseup
Quando l'utente preme il pulsante del mouse, la sostituzione di un'immagine.

onload
Quando la pagina è terminato il caricamento, visualizzare una finestra di messaggio.

onfocus
Quando il campo di ingresso ha il focus, cambiare il colore di sfondo.

eventi del mouse
Quando il puntatore si sposta sopra l'elemento, cambiare il suo colore, quando il puntatore si sposta fuori del testo, il suo colore cambierà di nuovo.