it-swarm.dev

Analizza la stringa di query in JavaScript

Possibile duplicato:
Come posso ottenere valori stringa di query?

Ho bisogno di analizzare la stringa di query www.mysite.com/default.aspx?dest=aboutus.aspx. Come ottengo la variabile dest in JavaScript?

315
sinaw

Ecco un modo semplice e veloce per analizzare le stringhe di query in JavaScript:

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 (decodeURIComponent(pair[0]) == variable) {
            return decodeURIComponent(pair[1]);
        }
    }
    console.log('Query variable %s not found', variable);
}

Ora fai una richiesta a page.html? X = Ciao :

console.log(getQueryVariable('x'));
315
Tarik
function parseQuery(queryString) {
    var query = {};
    var pairs = (queryString[0] === '?' ? queryString.substr(1) : queryString).split('&');
    for (var i = 0; i < pairs.length; i++) {
        var pair = pairs[i].split('=');
        query[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1] || '');
    }
    return query;
}

Trasforma la stringa di query come hello=1&another=2 nell'oggetto {hello: 1, another: 2}. Da lì, è facile estrarre la variabile che ti serve.

Detto questo, non tratta casi array come "hello=1&hello=2&hello=3". Per lavorare con questo, è necessario verificare se esiste una proprietà dell'oggetto che si esegue prima di aggiungerla e trasformarne il valore in un array, spingendo eventuali bit aggiuntivi.

139

Puoi anche usare la libreria eccellente URI.js di Rodney Rehm . Ecco come:-

var qs = URI('www.mysite.com/default.aspx?dest=aboutus.aspx').query(true); // == { dest : 'aboutus.aspx' }
    alert(qs.dest); // == aboutus.aspx

E per analizzare la stringa di query della pagina corrente: -

var $_GET = URI(document.URL).query(true); // ala PHP
    alert($_GET['dest']); // == aboutus.aspx 
55
Salman Abbas

Anche a me! http://jsfiddle.net/drzaus/8EE8k/

(Nota: senza controllo di fantasia nidificato o duplicato)

deparam = function (querystring) {
  // remove any preceding url and split
  querystring = querystring.substring(querystring.indexOf('?')+1).split('&');
  var params = {}, pair, d = decodeURIComponent;
  // march and parse
  for (var i = querystring.length - 1; i >= 0; i--) {
    pair = querystring[i].split('=');
    params[d(pair[0])] = d(pair[1] || '');
  }

  return params;
};//--  fn  deparam

E test:

var tests = {};
tests["simple params"] = "ID=2&first=1&second=b";
tests["full url"] = "http://blah.com/?" + tests["simple params"];
tests['just ?'] = '?' + tests['simple params'];

var $output = document.getElementById('output');
function output(msg) {
  $output.innerHTML += "\n" + Array.prototype.slice.call(arguments, 0).join("\n");
}
$.each(tests, function(msg, test) {
  var q = deparam(test);
  // Prompt, querystring, result, reverse
  output(msg, test, JSON.stringify(q), $.param(q));
  output('-------------------');
});

Risultati in:

simple params
ID=2&first=1&second=b
{"second":"b","first":"1","ID":"2"}
second=b&first=1&ID=2
-------------------
full url
http://blah.com/?ID=2&first=1&second=b
{"second":"b","first":"1","ID":"2"}
second=b&first=1&ID=2
-------------------
just ?
?ID=2&first=1&second=b
{"second":"b","first":"1","ID":"2"}
second=b&first=1&ID=2
-------------------
21
drzaus

Ecco la mia versione basata liberamente sulla precedente versione di Braceyard ma che analizza in un 'dizionario' e supporta gli argomenti di ricerca senza '='. In uso nella mia funzione JQuery $ (documento) .ready (). Gli argomenti sono memorizzati come coppie chiave/valore in argsParsed, che potresti voler salvare da qualche parte ...

'use strict';

function parseQuery(search) {

    var args = search.substring(1).split('&');

    var argsParsed = {};

    var i, arg, kvp, key, value;

    for (i=0; i < args.length; i++) {

        arg = args[i];

        if (-1 === arg.indexOf('=')) {

            argsParsed[decodeURIComponent(arg).trim()] = true;
        }
        else {

            kvp = arg.split('=');

            key = decodeURIComponent(kvp[0]).trim();

            value = decodeURIComponent(kvp[1]).trim();

            argsParsed[key] = value;
        }
    }

    return argsParsed;
}

parseQuery(document.location.search);
19
Henry Rusted

Seguendo il mio commento alla risposta @bobby postato, ecco il codice che userò:

    function parseQuery(str)
        {
        if(typeof str != "string" || str.length == 0) return {};
        var s = str.split("&");
        var s_length = s.length;
        var bit, query = {}, first, second;
        for(var i = 0; i < s_length; i++)
            {
            bit = s[i].split("=");
            first = decodeURIComponent(bit[0]);
            if(first.length == 0) continue;
            second = decodeURIComponent(bit[1]);
            if(typeof query[first] == "undefined") query[first] = second;
            else if(query[first] instanceof Array) query[first].Push(second);
            else query[first] = [query[first], second]; 
            }
        return query;
        }

Questo codice accetta la Querystring fornita (come 'str') e restituisce un oggetto. La stringa è divisa in tutte le occorrenze di &, risultante in una matrice. l'array viene quindi travserizzato e ogni elemento in esso viene diviso per "=". Ciò si traduce in sottoarray in cui l'elemento 0 è il parametro e il 1 ° elemento è il valore (o indefinito se no = segno). Questi sono mappati alle proprietà dell'oggetto, quindi per esempio la stringa "hello = 1 & another = 2 & something" è trasformata in:

{
hello: "1",
another: "2",
something: undefined
}

Inoltre, questo codice rileva ripetizioni ricorrenti come "ciao = 1 & ciao = 2" e converte il risultato in un array, ad esempio:

{
hello: ["1", "2"]
}

Noterai anche che si tratta di casi in cui il segno = non viene utilizzato. Ignora anche se c'è un segno di uguale subito dopo un simbolo &.

Un po 'eccessivo per la domanda originale, ma una soluzione riutilizzabile se hai mai avuto bisogno di lavorare con querystrings in javascript :)

15
jsdw

Se sai che avrai solo quella variabile di querystring, puoi semplicemente fare:

var dest = location.search.replace(/^.*?\=/, '');
8
CB01

La seguente funzione analizzerà la stringa di ricerca con un'espressione regolare, memorizzerà il risultato nella cache e restituirà il valore della variabile richiesta:

window.getSearch = function(variable) {
  var parsedSearch;
  parsedSearch = window.parsedSearch || (function() {
    var match, re, ret;
    re = /\??(.*?)=([^\&]*)&?/gi;
    ret = {};
    while (match = re.exec(document.location.search)) {
      ret[match[1]] = match[2];
    }
    return window.parsedSearch = ret;
  })();
  return parsedSearch[variable];
};

Puoi chiamarlo una volta senza parametri e lavorare con l'oggetto window.parsedSearch, o chiamare getSearch successivamente. Non ho ancora completamente provato questo, l'espressione regolare potrebbe ancora aver bisogno di qualche ritocco ...

7
amiuhle

Volevo una semplice funzione che prendesse un URL come input e restituisse una mappa dei parametri della query. Se dovessi migliorare questa funzione, supporterei lo standard per i dati dell'array nell'URL e nelle variabili annidate.

Questo dovrebbe funzionare e con la funzione jQuery.param (qparams).

function getQueryParams(url){
    var qparams = {},
        parts = (url||'').split('?'),
        qparts, qpart,
        i=0;

    if(parts.length <= 1 ){
        return qparams;
    }else{
        qparts = parts[1].split('&');
        for(i in qparts){

            qpart = qparts[i].split('=');
            qparams[decodeURIComponent(qpart[0])] = 
                           decodeURIComponent(qpart[1] || '');
        }
    }

    return qparams;
};
5
jdavid.net

Cosa ne pensi di questo?

function getQueryVar(varName){
    // Grab and unescape the query string - appending an '&' keeps the RegExp simple
    // for the sake of this example.
    var queryStr = unescape(window.location.search) + '&';

    // Dynamic replacement RegExp
    var regex = new RegExp('.*?[&\\?]' + varName + '=(.*?)&.*');

    // Apply RegExp to the query string
    val = queryStr.replace(regex, "$1");

    // If the string is the same, we didn't find a match - return false
    return val == queryStr ? false : val;
}

..questo lo chiami con:

alert('Var "dest" = ' + getQueryVar('dest'));

Saluti

2
Madbreaks

Volevo raccogliere link specifici all'interno di un elemento DOM su una pagina, inviare quegli utenti a una pagina di reindirizzamento su un timer e quindi passali sull'URL cliccato originale. Questo è come l'ho fatto usando il javascript normale incorporando uno dei metodi sopra.

Pagina con collegamenti: Testa

  function replaceLinks() {   
var content = document.getElementById('mainContent');
            var nodes = content.getElementsByTagName('a');
        for (var i = 0; i < document.getElementsByTagName('a').length; i++) {
            {
                href = nodes[i].href;
                if (href.indexOf("thisurl.com") != -1) {

                    nodes[i].href="http://www.thisurl.com/redirect.aspx" + "?url=" + nodes[i];
                    nodes[i].target="_blank";

                }
            }
    }
}

Corpo

<body onload="replaceLinks()">

Pagina di reindirizzamento Testa

   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 (decodeURIComponent(pair[0]) == variable) {
                return decodeURIComponent(pair[1]);
            }
        }
        console.log('Query variable %s not found', variable);
    }
    function delayer(){
        window.location = getQueryVariable('url')
    }

Corpo

<body onload="setTimeout('delayer()', 1000)">
2
bobby