Quelqu'un connaît-il un bon moyen d'écrire une extension jQuery pour gérer les paramètres de chaîne de requête? Je veux essentiellement étendre la ($)fonction magique jQuery afin de pouvoir faire quelque chose comme ceci:

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

Ce qui me donnerait la valeur « test » dans l'URL suivante: http://www.example.com/index.php?search=test.

J'ai vu beaucoup de fonctions qui peuvent faire cela dans jQuery et Javascript, mais je veux en fait étendre jQuery pour qu'il fonctionne exactement comme il est montré ci-dessus. Je ne recherche pas de plugin jQuery, je recherche une extension de la méthode jQuery.

Après des années d'analyse de chaînes horribles, il existe un meilleur moyen: URLSearchParams Voyons comment nous pouvons utiliser cette nouvelle API pour obtenir des valeurs à partir de l'emplacement!

// En supposant "? 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"

MISE À JOUR: IE n'est pas pris en charge

utilisez cette fonction à partir d' une réponse ci-dessous au lieu de 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

Pourquoi étendre jQuery? Quel serait l'avantage d'étendre jQuery par rapport à une simple fonction globale?

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/

Une autre approche consisterait à analyser la chaîne de requête entière et à stocker les valeurs dans un objet pour une utilisation ultérieure. Cette approche ne nécessite pas d'expression régulière et étend l' window.locationobjet (mais pourrait tout aussi bien utiliser une variable globale):

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/

Cette version utilise également Array.forEach(), qui n'est pas disponible nativement dans IE7 et IE8. Il peut être ajouté en utilisant l'implémentation chez MDN , ou vous pouvez utiliser jQuery à la $.each()place.

Le plugin JQuery jQuery-URL-Parser fait le même travail, par exemple pour récupérer la valeur du paramètre de chaîne de requête de recherche , vous pouvez utiliser

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

Cette bibliothèque n'est pas activement maintenue. Comme le suggère l'auteur du même plug - in, vous pouvez utiliser URI.js .

Ou vous pouvez utiliser js-url à la place. C'est assez similaire à celui ci-dessous.

Ainsi, vous pouvez accéder au paramètre de requête comme $.url('?search')

J'ai trouvé ce bijou de nos amis sur SitePoint. https://www.sitepoint.com/url-parameters-jquery/ .

Utilisation de PURE jQuery. Je viens de l'utiliser et cela a fonctionné. Je l'ai un peu modifié par exemple pour le saké.

//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]

Utilisez comme vous voudrez.

Ce n'est pas mon exemple de code, mais je l'ai utilisé dans le passé.

//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');

J'ai écrit une petite fonction où vous n'avez qu'à analyser le nom du paramètre de requête. Donc, si vous avez:? Project = 12 & Mode = 200 & date = 2013-05-27 et que vous voulez le paramètre 'Mode', il vous suffit d'analyser le nom 'Mode' dans la fonction:

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');

En s'appuyant sur la réponse de @Rob Neild ci-dessus, voici une pure adaptation JS qui renvoie un objet simple de paramètres de chaîne de requête décodés (pas de% 20, etc.).

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;
}

Écrit en Javascript vanille

     //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;
}

J'utilise ça.