wake-up-neo.com

Verwenden des GET-Parameters einer URL in JavaScript

Wenn ich auf einer Seite bin wie

http://somesite.com/somepage.php?param1=asdf

In dem JavaScript dieser Seite möchte ich eine Variable auf den Wert des Parameters im GET-Teil der URL setzen.

Also in JavaScript:

<script>
   param1var = ...   // ... would be replaced with the code to get asdf from URI
</script>

Was wäre wenn?

40
RobKohr

Hier sind einige Beispielcode dafür.

<script>
var param1var = getQueryVariable("param1");

function getQueryVariable(variable) {
  var query = window.location.search.substring(1);
  var vars = query.split("&");
  for (var i=0;i<vars.length;i++) {
    var pair = vars[i].split("=");
    if (pair[0] == variable) {
      return pair[1];
    }
  } 
  alert('Query Variable ' + variable + ' not found');
}
</script>
95
Jose Basilio

Sie können den Teil "Suche" des Standortobjekts abrufen und dann auswerten.

var matches = /param1=([^&#=]*)/.exec(window.location.search);
var param1 = matches[1];
9
gnarf

Ich habe diese Variante von Gnarfs Lösung gemacht, daher ist der Aufruf und das Ergebnis ähnlich wie in PHP:

function S_GET(id){
    var a = new RegExp(id+"=([^&#=]*)");
    return decodeURIComponent(a.exec(window.location.search)[1]);
}

Da das Aufrufen in einer Funktion den Prozess verlangsamt, ist es besser, sie als global zu verwenden:

window['var_name'] = decodeURIComponent( /var_in_get=([^&#=]*)/.exec(window.location.search)[1] );

UPDATE

Da ich noch JS lerne, habe ich eine bessere Antwort in einem JS-Verhalten erstellt:

Url = {
    get get(){
        var vars= {};
        if(window.location.search.length!==0)
            window.location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value){
                key=decodeURIComponent(key);
                if(typeof vars[key]==="undefined") {vars[key]= decodeURIComponent(value);}
                else {vars[key]= [].concat(vars[key], decodeURIComponent(value));}
            });
        return vars;
    }
};

Dies erlaubt es, nur mit Url.get Aufgerufen zu werden.

Beispiel Die URL ?param1=param1Value&param2=param2Value Kann wie folgt aufgerufen werden:

Url.get.param1 //"param1Value"
Url.get.param2 //"param2Value"

hier ist ein Schnipsel:

// URL GET params
url = "?a=2&a=3&b=2&a=4";

Url = {
    get get(){
        var vars= {};
        if(url.length!==0)
            url.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value){
                key=decodeURIComponent(key);
                if(typeof vars[key]==="undefined") {vars[key]= decodeURIComponent(value);}
                else {vars[key]= [].concat(vars[key], decodeURIComponent(value));}
            });
        return vars;
    }
};

document.querySelector('log').innerHTML = JSON.stringify(Url.get);
<log></log>
7
Gatsbimantico

Hier ist, wie Sie es in Coffee Script tun können (nur wenn jemand interessiert ist).

decodeURIComponent( v.split( "=" )[1] ) if decodeURIComponent( v.split( "=" )[0] ) == name for v in window.location.search.substring( 1 ).split( "&" )
2
Jasper Kennis

Aus meinem Programmierarchiv:

function querystring(key) {
   var re=new RegExp('(?:\\?|&)'+key+'=(.*?)(?=&|$)','gi');
   var r=[], m;
   while ((m=re.exec(document.location.search)) != null) r[r.length]=m[1];
   return r;
}

Wenn der Wert nicht existiert, wird ein leeres Array zurückgegeben.
Wenn der Wert vorhanden ist, wird ein Array zurückgegeben, das ein Element, den Wert, enthält.
Wenn mehrere Werte mit dem Namen vorhanden sind, wird ein Array mit jedem Wert zurückgegeben.

Beispiele:

var param1var = querystring("param1")[0];

document.write(querystring("name"));

if (querystring('id')=='42') alert('We apoligize for the inconvenience.');

if (querystring('button').length>0) alert(querystring('info'));
2
Guffa

Hier ist eine Version, die JSLint gefällt:

/*jslint browser: true */
var GET = {};
(function (input) {
    'use strict';
    if (input.length > 1) {
        var param = input.slice(1).replace(/\+/g, ' ').split('&'),
            plength = param.length,
            tmp,
            p;

        for (p = 0; p < plength; p += 1) {
            tmp = param[p].split('=');
            GET[decodeURIComponent(tmp[0])] = decodeURIComponent(tmp[1]);
        }
    }
}(window.location.search));

window.alert(JSON.stringify(GET));

Oder wenn Sie Unterstützung für mehrere Werte für einen Schlüssel benötigen, wie z. ? key = value1 & key = value2 können Sie dies verwenden:

/*jslint browser: true */
var GET = {};
(function (input) {
    'use strict';
    if (input.length > 1) {
        var params = input.slice(1).replace(/\+/g, ' ').split('&'),
            plength = params.length,
            tmp,
            key,
            val,
            obj,
            p;

        for (p = 0; p < plength; p += 1) {
            tmp = params[p].split('=');
            key = decodeURIComponent(tmp[0]);
            val = decodeURIComponent(tmp[1]);
            if (GET.hasOwnProperty(key)) {
                obj = GET[key];
                if (obj.constructor === Array) {
                    obj.Push(val);
                } else {
                    GET[key] = [obj, val];
                }
            } else {
                GET[key] = val;
            }
        }
    }
}(window.location.search));

window.alert(JSON.stringify(GET));
0
msand

Sie können diese Funktion verwenden

function getParmFromUrl(url, parm) {
    var re = new RegExp(".*[?&]" + parm + "=([^&]+)(&|$)");
    var match = url.match(re);
    return(match ? match[1] : "");
}
0
Reza

Wenn Sie bereits eine PHP-Seite betreiben, dann

pHP-Bit:

    $json   =   json_encode($_REQUEST, JSON_FORCE_OBJECT);
    print "<script>var getVars = $json;</script>";

js bit:

    var param1var = getVars.param1var;

Aber für HTML-Seiten sieht die Lösung von Jose Basilio für mich gut aus.

Viel Glück!

0
PowerAktar

Sie müssen eigentlich nichts Besonderes tun. Sie können JavaScript und PHP zusammenmischen, um Variablen aus PHP direkt in JavaScript zu erhalten.

var param1val = '<?php echo $_GET['param1'] ?>';
0
Mark

Verwenden Sie JQuery? Ich habe das schon mal benutzt: http://projects.allmarkedup.com/jquery_url_parser/ und es hat ziemlich gut funktioniert.

0
marcc

Das sah ok aus:

function gup( name ){
   name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
   var regexS = "[\\?&]"+name+"=([^&#]*)";
   var regex = new RegExp( regexS );
   var results = regex.exec( window.location.href );
   if( results == null )
      return "";
   else
      return results[1];
}

Von http://www.netlobo.com/url_query_string_javascript.html

0
agilefall