Nwlapcug.com


Come avere un iFrame pagine con un pulsante cambia

Come avere un iFrame pagine con un pulsante cambia


Microsoft chiama un iFrame "un documento all'interno di un documento". Se avete mai visto una pagina Web che si siede all'interno di un'altra pagina, sviluppatore del sito può aver creato tale effetto utilizzando iframe. IFrames hanno molti usi. Ad esempio, potresti mostrare condizioni meteo sulla tua pagina Web incorporando un iFrame che conteneva un sito Meteo. Se si collega un pulsante interattivo a tua iFrame, gli utenti possono modificare la pagina di iFrame facendo clic sul pulsante.

Istruzioni

1

Avviare Blocco note o il vostro programma di editing HTML.

2

Aprire una delle pagine Web e aggiungere il seguente codice HTML:

< iframe id = "IFrame1" width = "400px" height = "300px" >

< p > il tuo browser non può visualizzare iFrames </p >

< / iframe >

< input type = valore "pulsante" = "Modifica pagina" onclick = "return ChangePage()" / >

Questo crea un iFrame. La sua "src" Proprietà punta a home page di Google. Il pulsante denominato "ChangePage" chiama una funzione JavaScript quando cliccato. Che cambiamento di funzione del pagina di iFrame. Il testo "il browser Web non può visualizzare gli iframe" viene visualizzato in un browser se le impostazioni del browser che impediscono la visualizzazione fotogrammi. Nota la proprietà di "ID" dell'iFrame. Tale valore è "IFrame1." Questo valore di id consente una funzione JavaScript per individuare l'iFrame e lavorare con esso.

3

Aggiungere questo codice alla sezione "head" del documento:

< script language = "javascript" type = "text/javascript" >

var iFrameID = "IFrame1"

newPage var = "di http://www.bing.com";

Function ChangePage() () {

var iFrameObject = document.getElementById(iFrameID);

iFrameObject.src = newPage;

}

< / script >

La variabile "iFrameID" contiene l'ID di iFrame creato nel passaggio precedente. La variabile "newPage" contiene l'URL della nuova pagina che puoi iFrame per visualizzare. Tale URL è la homepage di Bing in questo esempio. La funzione JavaScript "ChangePage" ottiene un riferimento all'iFrame e cambiamento di valore "src" al valore memorizzato nella variabile "newPage".

4

Salvare il documento e aprirlo nel browser. Si vedrà la homepage di Google all'interno di iFrame della pagina.

5

Fare clic sul pulsante "Modifica pagina". La funzione JavaScript viene eseguito e cambiamento di pagina di iFrame per Bing.

Consigli & Avvertenze

  • Nome "ID" di iFrame tutto quello che ti piace. In questo esempio, quel nome è "iFrameID." Se si rinomina, modificare il valore di "iFrameID" in JavaScript per abbinare quel nome. In produzione, non è possibile il tasto per cambiare pagina di iFrame a Bing. Impostare il valore di "newPage" al nuovo URL che si desidera visualizzare quando gli utenti fanno clic sul pulsante "Modifica pagina".