Capita spesso di realizzare un sito usando i frames e poi di combattere con i pulsanti [Indietro] e [Avanti] del browser che tengono traccia dei singoli cambi di pagina nella finestra... solo che a noi spesso sarebbe utile far avanzare o indietreggiare un particolare frame e non l'ultimo frame modificato.
Questo script offre una possibile soluzione: tiene traccia in degli array dei movimenti che avvengono nei vari frames, così che se invece di usare i pulsanti del browser clicchiamo sugli appositi links otteniamo l'effetto voluto: nel nostro esempio tre frames che sono "target" di altrettanti, e di cui i genitori tengono la history.
Vediamo lo script:
<script language="javascript">
var clic = 0;
var ar = new Array('paperino.htm');
function Vai(u_r_l)
{
ar[ar.length]=u_r_l;
clic=ar.length
parent.dwsx.location.href=u_r_l;
}
function Indietro()
{
if (clic > 1 )
{
clic--;
parent.dwsx.location.href=ar[clic-1];
}
}
function Avanti()
{
if ( clic < ar.length)
{
parent.dwsx.location.href=ar[clic];
clic++;
}
}
</script>
Vengono per prima cosa definite una variabile "
clic" ed un array "
ar" che contiene già il primo elemento, cioè quello caricato dal frameset (v. le pagine di esempio).
I links alle varie pagine sono realizzati in modo particolare: non indicando semplicemente la pagina da caricare nel frame, ma passandola come parametro alla funzione
Vai() che si preoccupa di caricarla nel frame giusto:
Uno dei link è questo:
<a href="javascript:Vai('pippo.htm');">Pippo</a>.
Cosa succede quando
Vai() viene invocata? Semplicemente aggiunge un elemento all'array: la pagina html che ha ricevuto nel parametro
u_r_l (ricordate che la proprietà
length degli array comincia a contare da
1 quindi
ar.length è il
prossimo elemento dell'array) ed incrementa la variabile
clic.
Quest'ultima variabile è la chiave di volta per il nostro script. Osservate che nelle pagine superiori sono presenti due links:
<a href="#" onClick="Indietro();">Back</a> - <a href="#" onClick="Avanti();">Forward</a>
che attivano le altre due funzioni dello script:
Avanti() controlla che non abbiamo scorso tutto l'array (
click < ar.length sarà vera finché non arriviamo all'ultimo elemento) ed in tal caso carica nel frame l'elemento dell'array che ha indice
click. Poi incrementa l'indice perché alla prossima esecuzione della funzione caricheremo la pagina successiva... sempre che ci sia.
Indietro() fa un lavoro analogo, ma qui si controlla che la pagina visualizzata non sia la prima, se è così
clic viene decrementato e l'elemento "clic"-esimo dell'array caricato nel frame.
Anche se lo script non risolve completamente il problema della history dei frames consente comunque un maggiore controllo della navigazione. Ad esempio se avete una classica struttura con un primo frame orizzontale in alto (
principale), uno a sinistra (
menu) che funge da menu e quello centrale dove vengono caricati i contenuti, l'uso di questo script (caricato in alto che comanda quello di sinistra) vi consente di
tornare al menu precedente anche se diverse pagine sono cambiate nel frame centrale ed in tal caso la pressione di [back] del browser avrebbe effetto sul frame centrale e non su quello di sinistra come vorremmo.