Kennt jemand eine gute Möglichkeit, eine jQuery-Erweiterung zu schreiben, um Abfragezeichenfolgenparameter zu verarbeiten? Grundsätzlich möchte ich die magische jQuery- ($)Funktion erweitern, damit ich so etwas tun kann:

$('?search').val(); 

Welches würde mir den Wert "Test" in der folgenden URL geben : http://www.example.com/index.php?search=test.

Ich habe viele Funktionen gesehen, die dies in jQuery und Javascript tun können, aber ich möchte jQuery tatsächlich so erweitern, dass es genau so funktioniert, wie es oben gezeigt wird. Ich suche kein jQuery-Plugin, sondern eine Erweiterung der jQuery-Methode.

Nach Jahren hässlichen String-Parsens gibt es einen besseren Weg: URLSearchParams Schauen wir uns an, wie wir diese neue API verwenden können, um Werte vom Speicherort abzurufen !

// Angenommen "? Post = 1234 & action = edit"

var urlParams = new URLSearchParams(window.location.search);
console.log(urlParams.has('post')); // true
console.log(urlParams.get('action')); // "edit"
console.log(urlParams.getAll('action')); // ["edit"]
console.log(urlParams.toString()); // "?post=1234&action=edit"
console.log(urlParams.append('active', '1')); // "?

post=1234&action=edit&active=1"

UPDATE: IE wird nicht unterstützt

Verwenden Sie diese Funktion aus einer Antwort unten anstelle von URLSearchParams

$.urlParam = function (name) {
    var results = new RegExp('[\?&]' + name + '=([^&#]*)')
                      .exec(window.location.search);

    return (results !== null) ? results[1] || 0 : false;
}

console.log($.urlParam('action')); //edit

Warum jQuery erweitern? Was wäre der Vorteil einer Erweiterung von jQuery gegenüber einer globalen Funktion?

function qs(key) {
    key = key.replace(/[*+?^$.\[\]{}()|\\\/]/g, "\\$&"); // escape RegEx meta chars
    var match = location.search.match(new RegExp("[?&]"+key+"=([^&]+)(&|$)"));
    return match && decodeURIComponent(match[1].replace(/\+/g, " "));
}

http://jsfiddle.net/gilly3/sgxcL/

Ein alternativer Ansatz wäre, die gesamte Abfragezeichenfolge zu analysieren und die Werte zur späteren Verwendung in einem Objekt zu speichern. Dieser Ansatz erfordert keinen regulären Ausdruck und erweitert das window.locationObjekt (könnte aber genauso gut eine globale Variable verwenden):

location.queryString = {};
location.search.substr(1).split("&").forEach(function (pair) {
    if (pair === "") return;
    var parts = pair.split("=");
    location.queryString[parts[0]] = parts[1] &&
        decodeURIComponent(parts[1].replace(/\+/g, " "));
});

http://jsfiddle.net/gilly3/YnCeu/

Diese Version nutzt auch Array.forEach(), was nativ in IE7 und IE8 nicht verfügbar ist. Es kann mithilfe der Implementierung bei MDN hinzugefügt werden , oder Sie können $.each()stattdessen jQuery's verwenden.

JQuery jQuery-URL-Parser Plugin die gleiche Arbeit, zum Beispiel den Wert abrufen Suche Query - String param, können Sie

$.url().param('search');

Diese Bibliothek wird nicht aktiv gepflegt. Wie vom Autor desselben Plugins vorgeschlagen, können Sie URI.js verwenden .

Oder Sie können stattdessen js-url verwenden. Es ist ziemlich ähnlich zu dem unten.

So können Sie auf den Abfrageparameter wie zugreifen $.url('?search')

Fand dieses Juwel von unseren Freunden bei SitePoint. https://www.sitepoint.com/url-parameters-jquery/ .

Verwenden von PURE jQuery. Ich habe das gerade benutzt und es hat funktioniert. Zum Beispiel ein bisschen optimiert.

//URL is http://www.example.com/mypage?ref=registration&[email protected]

$.urlParam = function (name) {
    var results = new RegExp('[\?&]' + name + '=([^&#]*)')
                      .exec(window.location.search);

    return (results !== null) ? results[1] || 0 : false;
}

console.log($.urlParam('ref')); //registration
console.log($.urlParam('email')); //[email protected]

Verwenden Sie, wie Sie wollen.

Dies ist nicht mein Codebeispiel, aber ich habe es in der Vergangenheit verwendet.

//First Add this to extend jQuery

    $.extend({
      getUrlVars: function(){
        var vars = [], hash;
        var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
        for(var i = 0; i < hashes.length; i++)
        {
          hash = hashes[i].split('=');
          vars.push(hash[0]);
          vars[hash[0]] = hash[1];
        }
        return vars;
      },
      getUrlVar: function(name){
        return $.getUrlVars()[name];
      }
    });

    //Second call with this:
    // Get object of URL parameters
    var allVars = $.getUrlVars();

    // Getting URL var by its name
    var byName = $.getUrlVar('name');

Ich habe eine kleine Funktion geschrieben, bei der Sie nur den Namen des Abfrageparameters analysieren müssen. Wenn Sie also :? Project = 12 & Mode = 200 & date = 2013-05-27 haben und den Parameter 'Mode' möchten, müssen Sie nur den Namen 'Mode' in die Funktion analysieren:

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

// example caller:
var result =  getParameterByName('Mode');

Aufbauend auf der obigen Antwort von @Rob Neild ist hier eine reine JS-Anpassung, die ein einfaches Objekt dekodierter Abfragezeichenfolgenparameter (keine% 20 usw.) zurückgibt.

function parseQueryString () {
  var parsedParameters = {},
    uriParameters = location.search.substr(1).split('&');

  for (var i = 0; i < uriParameters.length; i++) {
    var parameter = uriParameters[i].split('=');
    parsedParameters[parameter[0]] = decodeURIComponent(parameter[1]);
  }

  return parsedParameters;
}

Geschrieben in Vanilla Javascript

     //Get URL
     var loc = window.location.href;
     console.log(loc);
     var index = loc.indexOf("?");
     console.log(loc.substr(index+1));
     var splitted = loc.substr(index+1).split('&');
     console.log(splitted);
     var paramObj = [];
     for(var i=0;i<splitted.length;i++){
         var params = splitted[i].split('=');
         var key = params[0];
         var value = params[1];
         var obj = {
             [key] : value
         };
         paramObj.push(obj);
         }
    console.log(paramObj);
    //Loop through paramObj to get all the params in query string.

function parseQueryString(queryString) {
    if (!queryString) {
        return false;
    }

    let queries = queryString.split("&"), params = {}, temp;

    for (let i = 0, l = queries.length; i < l; i++) {
        temp = queries[i].split('=');
        if (temp[1] !== '') {
            params[temp[0]] = temp[1];
        }
    }
    return params;
}

Ich benutze das.