Ricavare i parametri delle QueryString con JavaScript

Autore: Giovanni Bernardo | Data pubblicazione: 27 febbraio 2009

Innanzitutto: cos’è la querystring? E’ la parte che si trova in un url dopo il punto interrogativo. Per intenderci, in un indirizzo di esempio:

www.blablabla.com/index.html?parametro1=valore&amp;parametro2=altro_valore

La querystring è la parte ?parametro1=valore&parametro2=altro_valore dove abbiamo due parametri (o due variabili) alle quali è stato assegnato un valore. I vari parametri sono separati dal carattere ampersand (&). Questo sistema viene utilizzato per passare delle variabili da uno script all’altro o da pagina a pagina. Se in php è piuttosto semplice ricavare i parametri tramite la funzione

$_GET['nome_parametro']

potremmo trovarci nel caso di lavorare su una pagina html, senza supporto php, la quale ha bisogno di ricavare le variabili passate con la querystring. A questo punto possiamo ricorrere ad una semplice funzione in javascript (l’ho commentata abbastanza per farvi capire cosa succede):

<script type="text/javascript">
function getQSParam(ParamName) {
  // Memorizzo tutta la QueryString in una variabile
  QS=window.location.toString(); 
  // Posizione di inizio della variabile richiesta
  var indSta=QS.indexOf(ParamName); 
  // Se la variabile passata non esiste o il parametro è vuoto, restituisco null
  if (indSta==-1 || ParamName=="") return null; 
  // Posizione finale, determinata da una eventuale &amp; che serve per concatenare più variabili
  var indEnd=QS.indexOf('&amp;',indSta); 
  // Se non c'è una &amp;, il punto di fine è la fine della QueryString
  if (indEnd==-1) indEnd=QS.length; 
  // Ottengo il solore valore del parametro, ripulito dalle sequenze di escape
  var valore = unescape(QS.substring(indSta+ParamName.length+1,indEnd)); 
  // Restituisco il valore associato al parametro 'ParamName'
  return valore; 
  }
</script>

Questo script conviene metterlo nella sezione <head> del documento html. In un altro punto della pagina è possibile ricavare il valore delle variabili passate attraverso la querystring facendo ricorso a questa funzione. Ad esempio, supponendo di avere una pagina prova.html alla quale è stato passato il parametro ‘pippo’ con valore ‘ciao’, e cioè abbiamo richiamato la pagina in questo modo:

prova.html?pippo=ciao

Per visualizzare il valore di pippo in una parte della pagina, possiamo ricorrere a questo:

<script type="text/javascript">
document.write(getQSParam('pippo'));
</script>

Oppure se dobbiamo utilizzare il valore del parametro ‘pippo’ (preso ad esempio) in un altro script, possiamo farlo ugualmente, facilitandoci le cose assegnandolo ad una variabile:

<script type="text/javascript">
var pippo=getQSParam('pippo');
// resto dello script
// se la variabile pippo contiene un valore di tipo decimale
// potrebbe essere necessario convertirlo in float:
// var pippo=parseFloat(getQSParam('pippo'));
</script>

Articoli che potrebbero interessarti

L'articolo ti è piaciuto o ti è stato utile per risolvere un problema? Supporta e mantieni in vita questo sito, ci basta soltanto un caffè o una birra.
Se desiderate che settorezero continui a rimanere gratuito e fruibile da tutti, non copiate il nostro materiale e segnalateci se qualcuno lo fa

Puoi lasciare un commento, o un trackback dal tuo sito.

Elenco Categorie