javascript window on - Come recuperare i parametri GET da javascript?




9 Answers

Con l'oggetto developer.mozilla.org/en/DOM/window.location . Questo codice ti dà GET senza il punto interrogativo.

window.location.search.substr(1)

Dal tuo esempio restituirà returnurl=%2Fadmin

EDIT : Mi sono preso la libertà di cambiare la risposta di Qwerty , che è veramente buona , e come ha indicato ho seguito esattamente quello che l'OP chiedeva:

function findGetParameter(parameterName) {
    var result = null,
        tmp = [];
    location.search
        .substr(1)
        .split("&")
        .forEach(function (item) {
          tmp = item.split("=");
          if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
        });
    return result;
}

Ho rimosso l'esecuzione della funzione duplicata dal suo codice, sostituendola con una variabile (tmp) e inoltre ho aggiunto decodeURIComponent , esattamente come richiesto dall'OP. Non sono sicuro se questo potrebbe o meno essere un problema di sicurezza.

O altrimenti con plain for cycle, che funzionerà anche in IE8:

function findGetParameter(parameterName) {
    var result = null,
        tmp = [];
    var items = location.search.substr(1).split("&");
    for (var index = 0; index < items.length; index++) {
        tmp = items[index].split("=");
        if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
    }
    return result;
}
windows document

Questa domanda ha già una risposta qui:

http://domain.com/page.html?returnurl=%2Fadmin

Per js in page.html , come può recuperare i parametri GET ?

Per il semplice esempio sopra riportato, func('returnurl') dovrebbe essere /admin

Ma dovrebbe funzionare anche per complessi querystrngs ...




soluzione tl; dr su una singola riga di codice usando vanilla javascript

var queryDict = {}
location.search.substr(1).split("&").forEach(function(item) {queryDict[item.split("=")[0]] = item.split("=")[1]})

Questa è la soluzione più semplice . Sfortunatamente non gestisce chiavi multivalore e caratteri codificati.

"?a=1&a=%2Fadmin&b=2&c=3&d&e"
> queryDict
a: "%2Fadmin"  //overriden with last value, not decoded.
b: "2"
c: "3"
d: undefined
e: undefined

chiavi multivalore e caratteri codificati ?

Vedere la risposta originale in Come posso ottenere i valori stringa di query in JavaScript?

"?a=1&b=2&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab&a=%2Fadmin"
> queryDict
a: ["1", "5", "t e x t", "/admin"]
b: ["2"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]

Nel tuo esempio, dovresti accedere al valore in questo modo:

"?returnurl=%2Fadmin"
> qd.returnurl    // ["/admin"]
> qd['returnurl'] // ["/admin"]
> qd.returnurl[0] // "/admin"



un modo più elegante per farlo :)

var options = window.location.search.slice(1)
                      .split('&')
                      .reduce(function _reduce (/*Object*/ a, /*String*/ b) {
                        b = b.split('=');
                        a[b[0]] = decodeURIComponent(b[1]);
                        return a;
                      }, {});



var getQueryParam = function(param) {
    var found;
    window.location.search.substr(1).split("&").forEach(function(item) {
        if (param ==  item.split("=")[0]) {
            found = item.split("=")[1];
        }
    });
    return found;
};



Qui ho realizzato questo codice per trasformare i parametri GET in un oggetto per usarli più facilmente.

//Get Nav Url
function getNavUrl() {
    //Get Url
    return window.location.search.replace("?", "");
};
function getParameters(url) {
    //Params obj
    var params = {};
    //To lowercase
    url = url.toLowerCase();
    //To array
    url = url.split('&');

    //Iterate over url parameters array
    var length = url.length;
    for(var i=0; i<length; i++) {
        //Create prop
        var prop = url[i].slice(0, url[i].search('='));
        //Create Val
        var value = url[i].slice(url[i].search('=')).replace('=', '');
        //Params New Attr
        params[prop] = value;
    }
    return params;
};
//Call To getParameters
console.log(getParameters(getNavUrl()));



Questa soluzione gestisce la decodifica dell'URL:

var params = function() {
    function urldecode(str) {
        return decodeURIComponent((str+'').replace(/\+/g, '%20'));
    }

    function transformToAssocArray( prmstr ) {
        var params = {};
        var prmarr = prmstr.split("&");
        for ( var i = 0; i < prmarr.length; i++) {
            var tmparr = prmarr[i].split("=");
            params[tmparr[0]] = urldecode(tmparr[1]);
        }
        return params;
    }

    var prmstr = window.location.search.substr(1);
    return prmstr != null && prmstr != "" ? transformToAssocArray(prmstr) : {};
}();

Uso:

console.log('someParam GET value is', params['someParam']);



Se si utilizza angularjs, è possibile utilizzare $routeParams utilizzando il modulo ngRoute

Devi aggiungere un modulo sulla tua app

angular.module('myApp', ['ngRoute'])

Ora puoi usare il servizio $routeParams

.controller('AppCtrl', function($routeParams) {
  console.log($routeParams); //json object 
}



È possibile utilizzare la funzione di ricerca disponibile nell'oggetto posizione. La funzione di ricerca fornisce la parte parametro dell'URL. i dettagli possono essere trovati qui - http://www.javascriptkit.com/jsref/location.shtml

Dovrai analizzare la stringa risultante per ottenere le variabili e i loro valori, ad esempio dividerli su "="




Ho creato una semplice funzione Javascript per accedere ai parametri GET dall'URL.

Basta includere questa fonte Javascript e puoi accedere ai parametri get . Ad esempio: in http://example.com/index.php?language=french , è possibile accedere alla variabile della language come $_GET["language"] . Allo stesso modo, un elenco di tutti i parametri memorizzati in una variabile $_GET_Params come una matrice. Sia il codice Javascript che HTML sono forniti nel seguente frammento di codice:

<!DOCTYPE html>
<html>
  <body>
    <!-- This script is required -->
    <script>
    function $_GET() {
      // Get the Full href of the page e.g. http://www.google.com/files/script.php?v=1.8.7&country=india
      var href = window.location.href;
	
      // Get the protocol e.g. http
      var protocol = window.location.protocol + "//";
	
      // Get the host name e.g. www.google.com
      var hostname = window.location.hostname;
	
      // Get the pathname e.g. /files/script.php
      var pathname = window.location.pathname;
	
      // Remove protocol part
      var queries = href.replace(protocol, '');
	
      // Remove host part
      queries = queries.replace(hostname, '');
	
      // Remove pathname part
      queries = queries.replace(pathname, '');
	
      // Presently, what is left in the variable queries is : ?v=1.8.7&country=india
	
      // Perform query functions if present
      if (queries != "" && queries != "?") {
	
	    // Remove question mark ?
        queries = queries.slice(1);
	
        // Split all the different queries
        queries = queries.split("&");
		
        // Get the number of queries
        var length = queries.length;
		
        // Declare global variables to store keys and elements
        $_GET_Params = new Array();
        $_GET = {};
	
        // Perform functions per query
        for (var i  = 0; i < length; i++) {
			
          // Get the present query
          var key = queries[i];
			
          // Split the query and the value
          key = key.split("=");
			
          // Assign value to the $_GET variable
          $_GET[key[0]] = [key[1]];
			
          // Assign value to the $_GET_Params variable
          $_GET_Params[i] = key[0];
        }
      }
    }

    // Execute the function
    $_GET();
    </script>
    <h1>GET Parameters</h1>
    <h2>Try to insert some get parameter and access it through javascript</h2>
  </body>
</html>




Related