Utilizzare i comportamenti JavaScript (istruzioni generali)

I comportamenti di Adobe Dreamweaver inseriscono codice JavaScript nei documenti per consentire ai visitatori di modificare la pagina Web in vari modi oppure per far sì che vengano eseguite determinate operazioni. Un comportamento è una combinazione di un evento e un'azione attivata da quell'evento. Nel pannello Comportamenti, potete aggiungere un comportamento a una pagina specificando sia un'azione che l'evento che la determina.

Gli eventi sono, in sostanza, messaggi generati dai browser che indicano che un visitatore della pagina ha compiuto un'azione.Ad esempio, quando un visitatore sposta il puntatore su un collegamento, il browser genera un evento onMouseOver per quel collegamento; il browser verifica quindi se deve chiamare del codice JavaScript (specificato nella pagina visualizzata) in risposta.Eventi diversi vengono definiti per elementi di pagina diversi; ad esempio, nella maggior parte dei browser onMouseOver e onClick sono eventi associati ai collegamenti, mentre onLoad è un evento associato alle immagini e alla sezione body del documento.

Un'azione è codice JavaScript pre-scritto per eseguire un'attività, come aprire una finestra del browser, mostrare o nascondere un elemento AP, riprodurre un suono o arrestare un filmato Adobe Shockwave.Le azioni fornite con Dreamweaver garantiscono la massima compatibilità tra browser.

Dopo aver associato un comportamento a un elemento di pagina, il comportamento chiama l'azione (codice JavaScript) associata a un evento ogni volta che quell'evento si verifica per quell'elemento.(Gli eventi che puoi usare per attivare una determinata azione variano da browser a browser.)Ad esempio, se associ l'azione Messaggio popup a un collegamento e specifichi che verrà attivata dall'evento onMouseOver, il messaggio appare ogni volta che qualcuno posiziona il puntatore su quel collegamento.

Un singolo evento può attivare diverse azioni e puoi specificare l'ordine in cui quelle azioni si verificano.

Dreamweaver fornisce circa due dozzine di azioni; azioni aggiuntive si possono trovare sul sito web Exchange all'indirizzo www.adobe.com/go/dreamweaver_exchange e anche sui siti degli sviluppatori di terze parti.Puoi scrivere le tue azioni se sei esperto in JavaScript.

Panoramica sul pannello Comportamenti

Usa il pannello Comportamenti (Finestra > Comportamenti) per associare comportamenti agli elementi di pagina (più specificamente ai tag) e per modificare i parametri dei comportamenti associati in precedenza.

I comportamenti che sono già stati associati all'elemento di pagina attualmente selezionato appaiono nell'elenco dei comportamenti (l'area principale del pannello), elencati alfabeticamente per evento.Se diverse azioni sono elencate per lo stesso evento, vengono eseguite nell'ordine in cui appaiono nell'elenco.Se nessun comportamento appare nell'elenco dei comportamenti, nessun comportamento è stato associato all'elemento attualmente selezionato.

Il pannello Comportamenti contiene le seguenti opzioni:

Visualizza solo quegli eventi che sono stati associati al documento corrente.Gli eventi sono organizzati in categorie client-side o server-side. Ciascun evento di categoria è contenuto in un elenco comprimibile. Mostra eventi impostati è la visualizzazione predefinita.

Visualizza tutti gli eventi di una data categoria in ordine alfabetico.

Visualizza un menu di azioni che possono essere associate all'elemento attualmente selezionato.Quando selezioni un'azione da questo elenco, appare una finestra di dialogo in cui puoi specificare i parametri per l'azione. Se tutte le azioni sono disattivate, nessun evento può essere generato dall'elemento selezionato.

Rimuove l'evento e l'azione selezionati dall'elenco dei comportamenti.

Sposta l'azione selezionata verso l'alto o verso il basso nell'elenco dei comportamenti per un evento particolare.Puoi cambiare l'ordine delle azioni solo per un evento particolare: ad esempio, puoi cambiare l'ordine in cui si verificano diverse azioni per l'evento onLoad, ma tutte le azioni onLoad restano insieme nell'elenco comportamenti.I pulsanti freccia sono disabilitati per le azioni che non possono essere spostate verso l'alto o verso il basso nell'elenco.

È un menu a comparsa, visibile solo quando è selezionato un evento, di tutti gli eventi che possono generare l'azione (il menu appare quando fate clic sul pulsante freccia accanto al nome dell'evento selezionato). Gli eventi visualizzati variano a seconda dell'oggetto selezionato. Se l'elenco non contiene gli eventi previsti, verificate di aver selezionato l'elemento di pagina o il tag corretto. Per selezionare un tag specifico, utilizzate l'apposito selettore visualizzato nell'angolo inferiore sinistro della finestra del documento.

Informazioni sugli eventi

Ogni browser fornisce un set di eventi che puoi associare alle azioni elencate nel menu Azioni (+) del pannello Comportamenti.Quando un visitatore della tua pagina web interagisce con la pagina, ad esempio facendo clic su un'immagine, il browser genera eventi; questi eventi possono essere utilizzati per chiamare funzioni JavaScript che eseguono un'azione.Dreamweaver fornisce molte azioni comuni che puoi attivare con questi eventi.

Per nomi e descrizioni degli eventi forniti da ogni browser, consulta il Centro di supporto Dreamweaver all'indirizzo www.adobe.com/go/dreamweaver_support.

Nel menu Eventi vengono visualizzati eventi diversi a seconda dell'oggetto selezionato.Per scoprire quali eventi supporta un determinato browser per un determinato elemento della pagina, inserisci l'elemento della pagina nel documento e allega un comportamento a esso, quindi osserva il menu Eventi nel pannello Comportamenti.(Per impostazione predefinita, gli eventi sono tratti dall'elenco eventi HTML 4.01 e sono supportati dalla maggior parte dei browser moderni.)Gli eventi potrebbero essere disabilitati (in grigio) se gli oggetti pertinenti non esistono ancora nella pagina o se l'oggetto selezionato non può ricevere eventi.Se gli eventi previsti non vengono visualizzati, assicurati che sia selezionato l'oggetto corretto.

Se stai collegando un comportamento a un'immagine, alcuni eventi (come onMouseOver) vengono visualizzati tra parentesi.Questi eventi sono disponibili solo per i collegamenti.Quando selezioni uno di essi, Dreamweaver racchiude un tag <a> intorno all'immagine per definire un collegamento nullo.Il collegamento nullo è rappresentato da javascript:; nella casella Collegamento del pannello Proprietà.Puoi cambiare il valore del collegamento se vuoi trasformarlo in un collegamento reale a un'altra pagina, ma se elimini il collegamento JavaScript senza sostituirlo con un altro collegamento, rimuovi il comportamento.

Per vedere quali tag puoi utilizzare con un determinato evento in un determinato browser, cerca l'evento in uno dei file nella cartella Dreamweaver/Configuration/Behaviors/Events.

Applicare un comportamento

Puoi allegare comportamenti all'intero documento (cioè, al tag <body>) o a collegamento, immagine, elementi di modulo e diversi altri elementi HTML.

Il browser di destinazione che selezioni determina quali eventi sono supportati per un determinato elemento.

Puoi specificare più di un'azione per ogni evento.Le azioni si verificano nell'ordine in cui sono elencate nella colonna Azioni del pannello Comportamenti, ma puoi cambiare quell'ordine.

Modificare o eliminare un comportamento

Dopo aver collegato un comportamento, puoi cambiare l'evento che attiva l'azione, aggiungere o rimuovere azioni e modificare i parametri per le azioni.

Aggiornare un comportamento

Scaricare e installare comportamenti di terze parti

Molte estensioni sono disponibili sul sito Exchange for Dreamweaver (www.adobe.com/go/dreamweaver_exchange).

Per ulteriori informazioni, consulta Aggiungere e gestire estensioni in Dreamweaver.