Applicare comportamenti JavaScript incorporati

Ultimo aggiornamento il 27 apr 2021

Utilizza questo argomento per capire come applicare i comportamenti JavaScript integrati in Adobe Dreamweaver.

Utilizzare i comportamenti incorporati

I comportamenti inclusi con Dreamweaver sono stati scritti per funzionare nei browser moderni.In quelli più vecchi, potrebbero non funzionare (senza conseguenze).

Nota

Le azioni di Dreamweaver sono state progettate con attenzione per funzionare nel maggior numero possibile di browser.Se rimuovi manualmente il codice da un'azione di Dreamweaver o lo sostituisci con il tuo codice, potresti perdere la compatibilità cross-browser.

Sebbene le azioni di Dreamweaver siano state scritte per massimizzare la compatibilità cross-browser, alcuni browser non supportano affatto JavaScript e molte persone che navigano nel web mantengono JavaScript disattivato nei loro browser.Per ottenere risultati multipiattaforma ottimali, fornisci interfacce alternative racchiuse in tag <noscript> in modo che le persone senza JavaScript possano utilizzare il tuo sede.

Applicare il comportamento Chiama JavaScript

Il comportamento Call JavaScript esegue una funzione personalizzata o una riga di codice JavaScript quando si verifica un evento.(Puoi scrivere lo script da solo oppure utilizzare il codice fornito da varie librerie JavaScript disponibili gratuitamente sul web.)

Seleziona un oggetto e scegli Chiama JavaScript dal menu Aggiungi comportamento del pannello Comportamenti.
Digita l'esatto JavaScript da eseguire o digita il nome di una funzione.

Ad esempio, per creare un pulsante Indietro, potete digitare if (history.length > 0){history.back()}. Se hai incapsulato il codice in una funzione, digita solo il nome della funzione (ad esempio, hGoBack()).

Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Cambia proprietà

Utilizza il comportamento Cambia proprietà per modificare il Valore di una delle proprietà di un oggetto (ad esempio, il colore di sfondo di un div o l'azione di un modulo).

Nota

Utilizza questo comportamento solo se hai molta familiarità con HTML e JavaScript.

Seleziona un oggetto e scegli Cambia proprietà dal menu Aggiungi comportamento del pannello Comportamenti.
Dal menu Tipo di elemento, seleziona un tipo di elemento per visualizzare tutti gli elementi identificati di quel tipo.
Selezionate un elemento dal menu ID elemento.
Seleziona una proprietà dal menu Proprietà o inserisci il nome della proprietà nella casella.
Inserisci il nuovo valore per la nuova proprietà nel campo Nuovo Valore.
Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Controlla plugin

Utilizza il comportamento Controlla plug-in per inviare i visitatori a pagine diverse a seconda che abbiano installato il plug‑in specificato. Ad esempio, potresti volere che i visitatori vadano a una pagina se hanno Shockwave e a un'altra pagina se non ce l'hanno.

Nota

Non puoi rilevare plug‑in specifici in Internet Explorer utilizzando JavaScript. Tuttavia, selezionare Flash o Director aggiungerà il codice VBScript appropriato alla tua pagina per rilevare quei plug‑in in Internet Explorer su Windows. Il controllo dei plugin non è possibile in Internet Explorer su Mac OS.

Seleziona un oggetto e scegli Controlla plug-in dal menu Aggiungi comportamento del pannello Comportamenti.
Seleziona un plug‑in dal menu Plugin o fai clic su Inserisci e digita il nome esatto del plug‑in nella casella adiacente.

Devi utilizzare il nome esatto del plug-in come specificato in grassetto nella pagina About Plug-ins di Netscape Navigator. (In Windows, seleziona il comando Aiuto > Informazioni sui plug-in di Navigator; su Mac OS, seleziona Informazioni sui plug-in dal menu Apple.)

Nella casella If Found, Go To URL, specifica un URL per i visitatori che hanno il plug-in.

Se specifichi un URL remoto, devi includere il prefisso http:// nell'indirizzo.Se lasci il campo vuoto, i visitatori rimarranno sulla stessa pagina.

Nella casella Otherwise, Go To URL, specifica un URL alternativo per i visitatori che non hanno il plug-in. Se lasci il campo vuoto, i visitatori rimarranno sulla stessa pagina.
Specificate l'azione da eseguire se non è possibile rilevare il plugin. Per impostazione predefinita, quando il rilevamento è impossibile, il visitatore viene inviato all'URL elencato nella casella Otherwise. Per inviare invece il visitatore al primo URL (If Found), seleziona l'opzione Always Go To First URL If Detection Is Not Possible. Quando selezionata, questa opzione significa effettivamente "assumi che il visitatore abbia il plug-in, a meno che il browser non indichi esplicitamente che il plug-in non è presente." In generale, seleziona questa opzione se il contenuto del plug-in è parte integrante della tua pagina; altrimenti lasciala deselezionata.
Nota

Questa opzione si applica solo a Internet Explorer; Netscape Navigator può sempre rilevare i plug-in.

Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Trascina elemento PA

Il comportamento Drag AP Element consente al visitatore di trascinare un elemento posizionato assolutamente (AP). Usa questo comportamento per creare puzzle, controlli del cursore e altri elementi dell'interfaccia mobili.

Puoi specificare in quale direzione il visitatore può trascinare l'elemento AP (orizzontalmente, verticalmente o in qualsiasi direzione), un obiettivo verso cui il visitatore dovrebbe trascinare l'elemento AP, se agganciare l'elemento AP all'obiettivo se l'elemento AP si trova entro un certo numero di pixel dall'obiettivo, cosa fare quando l'elemento AP raggiunge l'obiettivo e altro ancora.

Poiché il comportamento Drag AP Element deve essere chiamato prima che il visitatore possa trascinare l'elemento AP, collega Drag AP Element all'oggetto body (con l'evento onLoad).

Seleziona Inserisci > Oggetti layout > AP Div o fai clic sul pulsante Disegna AP Div nel pannello Inserisci e disegna un AP Div nella vista Progettazione della finestra Documento.
Fai clic su <body> nel selettore tag nell'angolo inferiore sinistro della finestra Documento.
Seleziona Drag AP Element dal menu Aggiungi comportamento del pannello Comportamenti.

Se Drag AP Element non è disponibile, probabilmente hai un elemento AP selezionato.

Nel menu a comparsa Elemento PA, selezionate l'elemento PA.
Seleziona Constrained o Unconstrained dal menu a comparsa Movement.

Il movimento non vincolato è appropriato per puzzle e altri giochi di trascinamento. Per controlli cursore e scenari mobili come cassetti di file, tende e mini-persiane, seleziona movimento vincolato.

Per il movimento vincolato, inserisci valori (in pixel) nelle caselle Su, Giù, Sinistra e Destra.

I valori sono relativi alla posizione iniziale dell'elemento AP. Per vincolare il movimento all'interno di un'area rettangolare, inserisci valori positivi in tutte e quattro le caselle.Per consentire solo il movimento verticale, inserisci valori positivi per Su e Giù e 0 per Sinistra e Destra. Per consentire solo il movimento orizzontale, inserisci valori positivi per Sinistra e Destra e 0 per Su e Giù.

Inserisci i valori (in px) per la destinazione di rilascio nelle caselle Sinistra e Sopra.

La destinazione di rilascio è il punto in cui desideri che il visitatore trascini l'elemento AP. Un elemento AP viene considerato come se avesse raggiunto la destinazione di rilascio quando le sue coordinate sinistra e superiore corrispondono ai valori inseriti nelle caselle Sinistra e Sopra. I valori sono relativi all'angolo superiore sinistro della finestra del browser.Fai clic su Ottieni posizione corrente per compilare automaticamente le caselle di testo con la posizione corrente dell'elemento AP.

Inserisci un valore (in px) nella casella Aggancio se entro per determinare quanto vicino deve arrivare il visitatore alla destinazione di rilascio prima che l'elemento AP si agganci alla destinazione.

Valori più grandi rendono più facile per il visitatore trovare la destinazione di rilascio.

Per puzzle semplici e manipolazione di scenari, puoi fermarti qui. Per definire la maniglia di trascinamento per l'elemento AP, traccia il movimento dell'elemento AP mentre viene trascinato e attiva un'azione quando l'elemento AP viene rilasciato, fai clic sulla scheda Avanzate.
Per specificare che il visitatore deve fare clic su un'area particolare dell'elemento AP per trascinare l'elemento AP, seleziona Area all'interno dell'elemento dal menu Maniglia di trascinamento; quindi inserisci le coordinate sinistra e superiore e la larghezza e l'altezza della maniglia di trascinamento.

Questa opzione è utile quando l'immagine all'interno dell'elemento AP contiene un elemento che suggerisce il trascinamento, come una barra del titolo o la maniglia di un cassetto. Non impostare questa opzione se desideri che il visitatore possa fare clic ovunque nell'elemento AP per trascinarlo.

Se necessario, selezionate una delle seguenti opzioni per Durante il trascinamento:
  • Seleziona Porta elemento in primo piano se l'elemento AP deve spostarsi in primo piano nell'ordine di sovrapposizione mentre viene trascinato. Se selezioni questa opzione, usa il menu a comparsa per selezionare se lasciare l'elemento AP in primo piano o ripristinarlo alla sua posizione originale nell'ordine di sovrapposizione.

  • Inserisci codice JavaScript o un nome di funzione (ad esempio, monitorAPelement()) nella casella Chiama JavaScript per eseguire ripetutamente il codice o la funzione mentre l'elemento AP viene trascinato. Ad esempio, potresti scrivere una funzione che monitora le coordinate dell'elemento AP e visualizza suggerimenti come «ti stai avvicinando» o «non sei nemmeno vicino alla destinazione di rilascio» in una casella di testo.

Inserisci codice JavaScript o un nome di funzione (ad esempio, evaluateAPelementPos()) nella seconda casella Chiama JavaScript per eseguire il codice o la funzione quando l'elemento AP viene rilasciato. Seleziona Solo se agganciato se JavaScript deve essere eseguito solo se l'elemento AP ha raggiunto la destinazione di rilascio.
Fate clic su OK e verificate che l'evento predefinito sia corretto.

Raccogliere informazioni sugli elementi PA trascinabili

Quando alleghi il comportamento Trascina elemento AP a un oggetto, Dreamweaver inserisce la funzione MM_dragLayer() nella sezione head del documento. (La funzione mantiene la vecchia convenzione di denominazione per gli elementi AP [ovvero, "Layer"] in modo che i livelli creati nelle versioni precedenti di Dreamweaver rimangano modificabili.) Oltre a registrare l'elemento AP come trascinabile, questa funzione definisce tre proprietà per ogni elemento AP trascinabile—MM_LEFTRIGHT, MM_UPDOWN, e MM_SNAPPED—che puoi usare nelle tue funzioni JavaScript per determinare la posizione orizzontale relativa dell'elemento AP, la posizione verticale relativa dell'elemento AP e se l' elemento AP ha raggiunto la destinazione di rilascio.

Nota

Le informazioni fornite qui sono destinate esclusivamente ai programmatori JavaScript esperti.

Ad esempio, la seguente funzione visualizza il valore della proprietà MM_UPDOWN (la posizione verticale corrente dell'elemento AP) in un campo modulo chiamato curPosField. (I campi modulo sono utili per visualizzare informazioni aggiornate continuamente perché sono dinamici, ovvero è possibile cambiarne i contenuti dopo che la pagina ha terminato il caricamento.)

function getPos(layerId){

var layerRef = document.getElementById(layerId);

var curVertPos = layerRef.MM_UPDOWN;

document.tracking.curPosField.value = curVertPos;

}

Invece di visualizzare i valori di MM_UPDOWN o MM_LEFTRIGHT in un campo modulo, potresti utilizzare tali valori in diversi altri modi.Ad esempio, puoi scrivere una funzione che visualizza un messaggio nel campo del form a seconda di quanto il valore è vicino alla zona di rilascio, oppure puoi richiamare un'altra funzione per mostrare o nascondere un elemento AP a seconda del valore.

È particolarmente utile leggere la proprietà MM_SNAPPED quando sono presenti diversi elementi AP sulla pagina, che devono raggiungere tutti i loro obiettivi prima che il visitatore possa avanzare alla pagina o attività successiva. Ad esempio, è possibile scrivere una funzione per contare quanti elementi AP hanno un valore MM_SNAPPED di vero e richiamarla ogni volta che viene rilasciato un elemento AP. Quando il conteggio snap raggiunge il numero desiderato, puoi inviare il visitatore alla pagina successiva o visualizzare un messaggio di congratulazioni.

Applicare il comportamento Vai a URL

Il comportamento Vai a URL apre una nuova pagina nella finestra corrente o nel frame specificato.Questo comportamento è utile per cambiare i contenuti di due o più fotogrammi con un clic.

Seleziona un oggetto e scegli Vai a URL dal menu Aggiungi comportamento del pannello Comportamenti.
Selezionate una destinazione per l'URL dall'elenco Apri in.

L'elenco Apri in elenca automaticamente i nomi di tutti i fotogrammi nel set di fotogrammi corrente oltre alla finestra principale. Se non ci sono fotogrammi, la finestra principale è l'unica opzione.

Nota

Questo comportamento potrebbe produrre risultati imprevisti se un fotogramma è denominato top, blank, self o parent. I browser a volte scambiano questi nomi per nomi di destinazione riservati.

Fai clic su Sfoglia per selezionare un documento da aprire oppure inserisci il percorso e il nome file del documento nella casella URL.
Ripeti i passaggi 2 e 3 per aprire documenti aggiuntivi in altri fotogrammi.
Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Menu di collegamento

Quando crei un menu di collegamento utilizzando Inserisci > Modulo > Menu di collegamento, Dreamweaver crea un oggetto menu e vi collega il comportamento Menu di collegamento (o Vai al menu di collegamento). Di solito non è necessario collegare il comportamento Menu di collegamento a un oggetto manualmente.

Puoi modificare un menu di salto esistente in uno di due modi:

  • Puoi modificare e riorganizzare le voci di menu, cambiare i file verso cui saltare e cambiare la finestra in cui tali file si aprono, facendo doppio clic su un comportamento Menu di salto esistente nel pannello Comportamenti.

  • È possibile modificare le voci nel menu proprio come si modificherebbero le voci in qualsiasi menu, selezionando il menu e utilizzando il pulsante Valori elenco nella finestra di ispezione Proprietà.

Crea un oggetto menu di salto se non ce n'è già uno nel documento.
Seleziona l'oggetto e scegli Menu di selezione dal menu Aggiungi comportamento del pannello Comportamenti.
Apporta le modifiche desiderate nella finestra di dialogo Menu di salto e fai clic su OK.

Applicare il comportamento Vai a menu di collegamento

Il comportamento Vai del menu di selezione è strettamente associato al comportamento Menu di selezione; Vai del menu di selezione consente di associare un pulsante Vai a un menu di selezione. (Prima di utilizzare questo comportamento, deve già esistere un menu di selezione nel documento.) Facendo clic sul pulsante Vai si apre il collegamento selezionato nel menu di selezione. Un menu di selezione normalmente non richiede un pulsante Vai; selezionare un elemento da un menu di selezione generalmente causa il caricamento di un URL senza bisogno di ulteriori azioni da parte dell'utente. Ma se il visitatore seleziona lo stesso elemento già scelto nel menu di selezione, il salto non si verifica. In generale, questo non importa, ma se il menu di selezione appare in un fotogramma, e gli elementi del menu di selezione collegano a pagine in altri fotogrammi, un pulsante Vai è spesso utile, per consentire ai visitatori di riselezionare un elemento già selezionato nel menu di selezione.

Nota

Quando utilizzi un pulsante Vai con un menu di selezione, il pulsante Vai diventa l'unico meccanismo che "porta" l'utente all'URL associato alla selezione nel menu. Selezionare un elemento del menu nel menu di selezione non reindirizza più l'utente automaticamente a un'altra pagina o fotogramma.

Seleziona un oggetto da utilizzare come pulsante Vai (generalmente un'immagine del pulsante) e scegli Vai del menu di selezione dal menu Aggiungi comportamento del pannello Comportamenti.
Nel menu Scegli menu di salto, seleziona un menu per il pulsante Vai da attivare e fai clic su OK.

Applicare il comportamento Apri finestra browser

Utilizza il comportamento Apri finestra del browser per aprire una pagina in una nuova finestra.Puoi specificare le proprietà della nuova finestra, incluse le sue dimensioni, attributi (se è ridimensionabile, ha una barra dei menu e così via) e nome. Ad esempio, puoi utilizzare questo comportamento per aprire un'immagine più grande in una finestra separata quando il visitatore fa clic su una miniatura dell'immagine; con questo comportamento, puoi rendere la nuova finestra della dimensione esatta dell'immagine.

Se non specifichi attributi per la finestra, si apre alla dimensione e con gli attributi della finestra da cui è stata aperta. Specificare qualsiasi attributo per la finestra automaticamente disattiva tutti gli altri attributi che non sono esplicitamente attivati. Ad esempio, se non imposti attributi per la finestra, potrebbe aprirsi a 1024 x 768 pixel e avere una barra di navigazione (che mostra i pulsanti Indietro, Avanti, Home e Ricarica), barra degli indirizzi (che mostra l'URL), barra di stato (che mostra messaggi di stato, in basso) e barra dei menu (che mostra File, Modifica, Visualizza e altri menu).Se esplicitamente imposti la larghezza a 640 e l'altezza a 480 e non imposti altri attributi, la finestra si apre a 640 x 480 px, senza barre degli strumenti.

Seleziona un oggetto e scegli Apri finestra del browser dal menu Aggiungi comportamento del pannello Comportamenti.
Fai clic su Sfoglia per selezionare un file, o inserisci l'URL che vuoi visualizzare.
Imposta le opzioni per larghezza e altezza della finestra (in pixel) e per l'incorporazione di varie barre degli strumenti, barre di scorrimento, maniglie di ridimensionamento e simili.Assegna un nome alla finestra (non utilizzare spazi o caratteri speciali) se vuoi che sia la destinazione di collegamenti o vuoi controllarla con JavaScript.
Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Messaggio popup

Il comportamento Messaggio popup visualizza un avviso JavaScript con il messaggio che specifichi. Poiché gli avvisi JavaScript hanno solo un pulsante (OK), utilizza questo comportamento per fornire informazioni all'utente piuttosto che per presentare una scelta.

Puoi incorporare qualsiasi chiamata di funzione JavaScript valida, proprietà, variabile globale o altra espressione nel testo. Per incorporare un'espressione JavaScript, posizionala tra parentesi graffe ({}). Per visualizzare una parentesi graffa, falla precedere da una barra rovesciata (\{).

Esempio:

L'URL di questa pagina è {window.location} e oggi è {new Date()}.

Nota

Il browser controlla l'aspetto dell'avviso. Se vuoi un maggiore controllo sull'aspetto, considera l'uso del comportamento Apri finestra browser.

Seleziona un oggetto e seleziona Messaggio popup dal menu Aggiungi comportamento del pannello Comportamenti.
Inserite il messaggio desiderato nella casella Messaggio.
Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Precarica immagini

Il comportamento Precarica immagini riduce i tempi di visualizzazione memorizzando in cache le immagini che non vengono mostrate quando la pagina si apre per la prima volta (ad esempio, le immagini che verranno scambiate con comportamenti o Script).

Nota

Il comportamento Scambia immagine precarica automaticamente tutte le immagini in primo piano quando selezioni l'opzione Precarica immagini nella finestra di dialogo Scambia immagine, quindi non devi aggiungere manualmente Precarica immagini quando usi Scambia immagine.

Seleziona un oggetto e seleziona Precarica immagini dal menu Aggiungi comportamento del pannello Comportamenti.
Fai clic su Sfoglia per selezionare un file di immagine oppure inserisci il percorso e il nome del file di un'immagine nella casella File Image Source.
Fai clic sul pulsante Più (+) nella parte superiore della finestra di dialogo per aggiungere l'immagine all'elenco Precarica immagini.
Ripeti i passaggi 2 e 3 per tutte le rimanenti immagini che vuoi precaricare nella pagina corrente.
Per rimuovere un'immagine dall'elenco Precarica immagini, selezionala e fai clic sul pulsante Meno (–).
Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Imposta testo del frame

Il comportamento Imposta testo del fotogramma ti consente di impostare dinamicamente il testo di un fotogramma, sostituendo il contenuto e la formattazione di un fotogramma con il contenuto che specifichi. Il contenuto può includere qualsiasi codice HTML valido. Utilizzate questo comportamento per visualizzare informazioni in modo dinamico.

Anche se il comportamento Imposta testo del fotogramma sostituisce la formattazione di un fotogramma, puoi selezionare Mantieni colore di sfondo per mantenere gli attributi del colore di sfondo e del testo della pagina.

Puoi incorporare qualsiasi chiamata di funzione JavaScript valida, proprietà, variabile globale o altra espressione nel testo. Per incorporare un'espressione JavaScript, posizionala tra parentesi graffe ({}). Per visualizzare una parentesi graffa, falla precedere da una barra rovesciata (\{).

Esempio:

L'URL di questa pagina è {window.location} e oggi è {new Date()}.

Seleziona un oggetto e poi scegli Imposta testo > Imposta testo del fotogramma dal menu Aggiungi comportamento del pannello Comportamenti.
Nella finestra di dialogo Imposta testo del fotogramma, seleziona il fotogramma di destinazione dal menu Fotogramma.
Fai clic sul pulsante Ottieni HTML corrente per copiare il contenuto corrente della sezione corpo del fotogramma di destinazione.
Inserite un messaggio nella casella Nuovo HTML.
Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applica il comportamento Imposta testo del contenitore

Il comportamento Imposta testo del contenitore sostituisce il contenuto e la formattazione di un contenitore esistente (ovvero qualsiasi elemento che può contenere testo o altri elementi) su una pagina con il contenuto specificato. Tale contenuto può essere costituito da qualunque codice di origine HTML valido.

Puoi incorporare qualsiasi chiamata di funzione JavaScript valida, proprietà, variabile globale o altra espressione nel testo. Per incorporare un'espressione JavaScript, inseriscila tra parentesi graffe ({}). Per visualizzare una parentesi graffa, falla precedere da una barra rovesciata (\{).

Esempio:

L'URL di questa pagina è {window.location} e oggi è {new Date()}.

Seleziona un oggetto e seleziona Imposta testo > Imposta testo del contenitore dal menu Aggiungi comportamento del pannello Comportamenti.
Nella finestra di dialogo Imposta testo del contenitore, usa il menu Contenitore per selezionare l'elemento di destinazione.
Inserite il nuovo testo o codice HTML nella casella Nuovo HTML.
Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Imposta testo della barra di stato

Il comportamento Imposta testo della barra di stato mostra un messaggio nella barra di stato nell'angolo in basso a sinistra della finestra del browser. Ad esempio, puoi usare questo comportamento per descrivere la destinazione di un collegamento nella barra di stato anziché mostrare l'URL ad esso associato. I visitatori spesso ignorano o trascurano i messaggi nella barra di stato (e non tutti i browser forniscono supporto completo per impostare il testo della barra di stato); se il tuo messaggio è importante, considera di visualizzarlo come messaggio pop-up o come testo di un elemento AP.

Nota

Se usi il comportamento Imposta testo della barra di stato in Dreamweaver, non è garantito che il testo della barra di stato nel browser cambi perché alcuni browser richiedono regolazioni speciali quando si modifica il testo della barra di stato. Firefox, ad esempio, richiede di modificare un'opzione Avanzata che permette a JavaScript di cambiare il testo della barra di stato. Per ulteriori informazioni, consultate la documentazione del browser.

Puoi incorporare qualsiasi chiamata di funzione JavaScript valida, proprietà, variabile globale o altra espressione nel testo. Per incorporare un'espressione JavaScript, inseriscila tra parentesi graffe ({}). Per visualizzare una parentesi graffa, falla precedere da una barra rovesciata (\{).

Esempio:

L'URL di questa pagina è {window.location} e oggi è {new Date()}.

Seleziona un oggetto e scegli Imposta testo > Imposta testo della barra di stato dal menu Aggiungi comportamento del pannello Comportamenti.
Nella finestra di dialogo Imposta testo della barra di stato, digita il messaggio nella casella Messaggio.

Inserite un messaggio breve. Il browser tronca il messaggio se non rientra nella barra di stato.

Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Imposta testo del campo di testo

Il comportamento Imposta testo del campo di testo sostituisce il contenuto di un campo di testo di un modulo con il contenuto specificato.

Puoi incorporare qualsiasi chiamata di funzione JavaScript valida, proprietà, variabile globale o altra espressione nel testo. Per incorporare un'espressione JavaScript, inseriscila tra parentesi graffe ({}). Per visualizzare una parentesi graffa, fatela precedere da una barra rovesciata (\{).

Esempio:

L'URL di questa pagina è {window.location} e oggi è {new Date()}.

Creare un campo di testo con nome

Seleziona Inserisci > Modulo > Campo di testo.

Se Dreamweaver ti chiede di aggiungere un tag modulo, fai clic su Sì.

Nella finestra di ispezione Proprietà, digitate un nome per il campo di testo. Assicurati che il nome sia univoco nella pagina (non utilizzare lo stesso nome per più elementi nella stessa pagina, anche se si trovano in moduli diversi).

Applicare Imposta testo del campo di testo

Seleziona un campo di testo e scegli Imposta testo > Imposta testo del campo dal menu Aggiungi comportamento del pannello Comportamenti.
Seleziona il campo di testo di destinazione dal menu Campo di testo e inserisci il nuovo testo.
Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Mostra-nascondi elementi

Il comportamento Mostra-Nascondi elementi mostra, nasconde o ripristina la visibilità predefinita di uno o più elementi della pagina. Questo comportamento è utile per visualizzare informazioni mentre l'utente interagisce con la pagina.Ad esempio, mentre l'utente sposta il puntatore su un' immagine di una pianta, potresti mostrare un elemento della pagina con dettagli sulla stagione di crescita e l'area geografica della pianta, quanta luce solare necessita, quanto può crescere e così via. Il comportamento mostra o nasconde solo l'elemento pertinente: non rimuove effettivamente l'elemento dal flusso della pagina quando è nascosto.

Seleziona un oggetto e seleziona Mostra-Nascondi elementi dal menu Aggiungi comportamento del pannello Comportamenti.

Se Mostra-Nascondi elementi non è disponibile, probabilmente hai selezionato un elemento AP. Poiché gli elementi AP non accettano eventi in entrambi i browser 4.0, devi selezionare un oggetto diverso, come il tag <body> o un collegamento tag (<a>).

Dall'elenco Elementi, seleziona l'elemento che vuoi mostrare o nascondere e fai clic su Mostra, Nascondi o Ripristina (che ripristina la visibilità predefinita).
Ripeti il passaggio 2 per tutti gli elementi rimanenti di cui vuoi cambiare la visibilità. (Puoi cambiare la visibilità di più elementi con un singolo comportamento.)
Fate clic su OK e verificate che l'evento predefinito sia corretto.

Questo comportamento è deprecato a partire da Dreamweaver CS5.

Applicare il comportamento Scambia immagine

Il comportamento Scambia immagine scambia un'immagine con un'altra modificando l'attributo src del tag <img>. Utilizza questo comportamento per creare rollover di pulsanti e altri effetti immagine (incluso lo scambio di più immagini contemporaneamente).L'inserimento di un'immagine di cumulabilità aggiunge automaticamente un comportamento Scambia immagine alla pagina.

Nota

Poiché solo l'attributo src è interessato da questo comportamento, dovresti scambiare con un'immagine che abbia le stesse dimensioni (altezza e larghezza) dell'originale. Altrimenti, l'immagine che scambi si riduce o si espande per adattarsi alle dimensioni dell'immagine originale.

Esiste anche un comportamento Ripristina scambio immagine, che ripristina l'ultimo set di immagini scambiate ai file di origine precedenti. Questo comportamento viene aggiunto automaticamente ogni volta che colleghi il comportamento Scambia immagine a un oggetto; se lasci l'opzione Ripristina selezionata durante il collegamento di Scambia immagine, non dovresti mai aver bisogno di selezionare manualmente il comportamento Ripristina scambio immagine.

Seleziona Inserisci > Immagine o fai clic sul pulsante Immagine nel pannello Inserisci per inserire un'immagine.
Nell'Ispettore proprietà, inserisci un nome per l'immagine nella casella di testo più a sinistra.

Non è obbligatorio assegnare un nome alle immagini; vengono rinominate automaticamente quando colleghi il comportamento a un oggetto. Tuttavia, è più facile distinguere le immagini nella finestra di dialogo Scambia immagine se assegni un nome a tutte le immagini in anticipo.

Ripetete i passaggi 1 e 2 per inserire altre immagini.
Seleziona un oggetto (generalmente l'immagine che stai per scambiare) e scegli Scambia immagine dal menu Aggiungi comportamento del pannello Comportamenti.
Dall'elenco Immagini, seleziona l'immagine di cui vuoi cambiare l'origine.
Fai clic su Sfoglia per selezionare il nuovo file di immagine, oppure inserisci il percorso e il nome file della nuova immagine nella casella Imposta origine su.
Ripeti i passaggi 5 e 6 per eventuali immagini aggiuntive che vuoi cambiare. Usa la stessa azione Scambia immagine per tutte le immagini che vuoi cambiare contemporaneamente; altrimenti, l'azione corrispondente Ripristina scambio immagine non le ripristinerà tutte.
Seleziona l'opzione Precarica immagini per memorizzare in cache le nuove immagini quando viene caricata la pagina.

Questo impedisce ritardi nel download quando le immagini devono essere visualizzate.

Fate clic su OK e verificate che l'evento predefinito sia corretto.

Applicare il comportamento Convalida modulo

Il comportamento Convalida modulo controlla il contenuto dei campi di testo specificati per assicurarsi che l'utente abbia inserito il tipo corretto di dati. Collega questo comportamento a singoli campi di testo con l'evento onBlur per convalidare i campi mentre l'utente compila il modulo, oppure collegalo al modulo con l'evento onSubmit per valutare diversi campi di testo contemporaneamente quando l'utente fa clic sul pulsante Invia. Collegare questo comportamento a un modulo impedisce l'invio di moduli con dati non validi.

Seleziona Inserisci > Modulo o fai clic sul pulsante Modulo nel pannello Inserisci per inserire un modulo.
Seleziona Inserisci > Modulo > Campo di testo o fai clic sul pulsante Campo di testo nel pannello Inserisci per inserire un campo di testo.

Ripetete questo passaggio per inserire altri campi di testo.

Scegliete un metodo di convalida:
  • Per convalidare i singoli campi mentre l'utente compila il modulo, seleziona un campo di testo e seleziona Finestra > Comportamenti.

  • Per convalidare più campi quando l'utente invia il modulo, fai clic sul tag <form> nel selettore di tag nell'angolo inferiore sinistro della finestra Documento e scegli Finestra > Comportamenti.

Selezionate Convalida modulo dal menu Aggiungi comportamento.
Effettuate una delle operazioni seguenti:
  • Se stai convalidando i singoli campi, seleziona lo stesso campo che hai selezionato nella finestra Documento dall' elenco Campi.

  • Se stai convalidando più campi, seleziona un campo di testo dall'elenco Campi.

Seleziona l'opzione Obbligatorio se il campo deve contenere qualche dato.
Selezionate una delle opzioni Accetta seguenti:

Qualunque

Controlla che un campo obbligatorio contenga dati; i dati possono essere di qualsiasi tipo.

Indirizzo e-mail

Controlla che il campo contenga un simbolo @.

Numero

Controlla che il campo contenga solo caratteri numerici.

Numeri da

Controlla che il campo contenga un numero in un intervallo specifico.

Se hai scelto di convalidare più campi, ripeti i passaggi 6 e 7 per eventuali campi aggiuntivi che vuoi convalidare.
Fate clic su OK.

Se stai convalidando più campi quando l'utente invia il modulo, l'evento onSubmit appare automaticamente nel menu Eventi.

Se stai convalidando i singoli campi, controlla che l'evento predefinito sia onBlur o onChange.In caso contrario, selezionate uno di questi eventi.

Entrambi gli eventi attivano il comportamento Convalida modulo quando l'utente si allontana dal campo.La differenza è che onBlur si verifica indipendentemente dal fatto che l'utente abbia digitato nel campo o meno, e onChange si verifica solo se l'utente ha modificato i contenuti del campo. L'evento onBlur è preferibile se il campo è obbligatorio.