web-dev-qa-db-fra.com

Obtenir le paramètre d'URL échappé

Je recherche un plug-in jQuery pouvant obtenir des paramètres d'URL et prenant en charge cette chaîne de recherche sans générer l'erreur JavaScript "séquence d'URI mal formée". S'il n'y a pas de plugin jQuery qui supporte cela, j'ai besoin de savoir comment le modifier pour le supporter.

?search=%E6%F8%E5

La valeur du paramètre d'URL, une fois décodé, devrait être:

æøå

(les personnages sont norvégiens).

Je n'ai pas accès au serveur, je ne peux donc rien y modifier.

301
Sindre Sorhus

Vous ne devriez pas utiliser jQuery pour quelque chose comme ça!
La méthode moderne consiste à utiliser de petits modules réutilisables via un gestionnaire de paquets comme Bower.

J'ai créé un minuscule module qui peut analyser la chaîne de requête dans un objet. Utilisez-le comme ceci:

// parse the query string into an object and get the property
queryString.parse(unescape(location.search)).search;
//=> æøå
2
Sindre Sorhus
function getURLParameter(name) {
    return decodeURI(
        (RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
    );
}
418
James

Vous trouverez ci-dessous ce que j'ai créé à partir des commentaires ici, ainsi que la correction des bogues non mentionnés (tels que le renvoi de null, et non de 'null'):

function getURLParameter(name) {
    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null;
}
294
radicand

Ce que vous voulez vraiment, c’est = plugin jQuery URL Parser . Avec ce plugin, obtenir la valeur d'un paramètre d'URL spécifique (pour l'URL actuelle) ressemble à ceci:

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

Si vous voulez un objet avec les noms de paramètres sous forme de clés et les valeurs de paramètres sous forme de valeurs, appelez simplement param() sans argument, comme ceci:

$.url().param();

Cette bibliothèque fonctionne également avec d'autres URL, pas seulement avec celle actuelle:

$.url('http://allmarkedup.com?sky=blue&grass=green').param();
$('#myElement').url().param(); // works with elements that have 'src', 'href' or 'action' attributes

Comme il s'agit d'une bibliothèque d'analyse syntaxique complète, vous pouvez également obtenir d'autres informations à partir de l'URL, telles que le port spécifié, le chemin, le protocole, etc.:

var url = $.url('http://allmarkedup.com/folder/dir/index.html?item=value');
url.attr('protocol'); // returns 'http'
url.attr('path'); // returns '/folder/dir/index.html'

Il a également d'autres fonctionnalités, consultez son page d'accueil pour plus de documents et d'exemples.

Au lieu d’écrire votre propre analyseur d’URI dans ce but précis que , un peu fonctionne dans most , utilisez un analyseur d’URI réel. En fonction de la réponse, le code des autres réponses peut renvoyer 'null' au lieu de null, ne fonctionne pas avec des paramètres vides (?foo=&bar=x), ne peut pas analyser et renvoyer tous les paramètres en même temps, répète le travail si vous interrogez à plusieurs reprises l'URL pour les paramètres, etc.

Utilisez un analyseur URI réel, n'inventez pas le vôtre.

Pour ceux qui sont opposés à jQuery, il y a ne version du plugin qui est purement JS .

107
Lucas

Si vous ne connaissez pas les paramètres d'URL et souhaitez obtenir un objet avec les clés et les valeurs contenues dans les paramètres, vous pouvez utiliser ceci:

function getParameters() {
  var searchString = window.location.search.substring(1),
      params = searchString.split("&"),
      hash = {};

  if (searchString == "") return {};
  for (var i = 0; i < params.length; i++) {
    var val = params[i].split("=");
    hash[unescape(val[0])] = unescape(val[1]);
  }
  return hash;
}

Appeler getParameters () avec une URL telle que /posts?date=9/10/11&author=nilbus renverrait:

{
  date:   '9/10/11',
  author: 'nilbus'
}

Je n'inclurai pas le code ici car il est encore plus éloigné de la question, mais weareon.net a posté une bibliothèque qui permet également de manipuler les paramètres dans l'URL:

43
Edward Anderson

Vous pouvez utiliser la propriété native du navigateur location.search :

function getParameter(paramName) {
  var searchString = window.location.search.substring(1),
      i, val, params = searchString.split("&");

  for (i=0;i<params.length;i++) {
    val = params[i].split("=");
    if (val[0] == paramName) {
      return unescape(val[1]);
    }
  }
  return null;
}

Mais il existe des plugins jQuery qui peuvent vous aider:

40
CMS

Basé sur le réponse de 999 :

function getURLParameter(name) {
    return decodeURIComponent(
        (location.search.match(RegExp("[?|&]"+name+'=(.+?)(&|$)'))||[,null])[1]
    );  
}

Changements:

  • decodeURI() est remplacé par decodeURIComponent()
  • [?|&] est ajouté au début de l'expression rationnelle
26
Eugene Yarmash

Besoin d'ajouter le paramètre i pour le rendre insensible à la casse:

  function getURLParameter(name) {
    return decodeURIComponent(
      (RegExp(name + '=' + '(.+?)(&|$)', 'i').exec(location.search) || [, ""])[1]
    );
  }
6
Scott Wojan
$.urlParam = function(name){
  var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(top.window.location.href); 
  return (results !== null) ? results[1] : 0;
}

$.urlParam("key");
2
Yoshi

Par exemple, une fonction qui renvoie la valeur de toute variable de paramètre.

function GetURLParameter(sParam)
{
    var sPageURL = window.location.search.substring(1);
    var sURLVariables = sPageURL.split('&');
    for (var i = 0; i < sURLVariables.length; i++)
    {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] == sParam)
        {
            return sParameterName[1];
        }
    }
}​

Et voici comment utiliser cette fonction en supposant que l'URL est,

"http://example.com/?technology=jquery&blog=jquerybyexample".

var tech = GetURLParameter('technology');
var blog = GetURLParameter('blog');

Donc, dans la variable de code ci-dessus, "tech" aura pour valeur "jQuery" et la variable "blog" sera "jquerybyexample".

2
Rubyist

Après avoir lu toutes les réponses, je me suis retrouvé avec cette version avec + une deuxième fonction pour utiliser les paramètres comme drapeaux

function getURLParameter(name) {
    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)','i').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null;
}

function isSetURLParameter(name) {
    return (new RegExp('[?|&]' + name + '(?:[=|&|#|;|]|$)','i').exec(location.search) !== null)
}
1
Neon

extrait de code jQuery pour obtenir les variables dynamiques stockées dans l'URL en tant que paramètres et les stocker en tant que variables JavaScript prêtes à être utilisées avec vos scripts:

$.urlParam = function(name){
    var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(window.location.href);
    if (results==null){
       return null;
    }
    else{
       return results[1] || 0;
    }
}

example.com?param1=name&param2=&id=6

$.urlParam('param1'); // name
$.urlParam('id');        // 6
$.urlParam('param2');   // null

//example params with spaces
http://www.jquery4u.com?city=Gold Coast
console.log($.urlParam('city'));  
//output: Gold%20Coast

console.log(decodeURIComponent($.urlParam('city'))); 
//output: Gold Coast
<script type="text/javascript">
function getURLParameter(name) {
        return decodeURIComponent(
            (location.search.toLowerCase().match(RegExp("[?|&]" + name + '=(.+?)(&|$)')) || [, null])[1]
        );
    }

</script>

getURLParameter(id) ou getURLParameter(Id) fonctionne de la même manière:)

0
user2310887

Il y a beaucoup de code buggy ici et les solutions de regex sont très lentes. J'ai trouvé une solution qui fonctionne jusqu'à 20 fois plus rapidement que son homologue regex et d'une simplicité élégante:

    /*
    *   @param      string      parameter to return the value of.
    *   @return     string      value of chosen parameter, if found.
    */
    function get_param(return_this)
    {
        return_this = return_this.replace(/\?/ig, "").replace(/=/ig, ""); // Globally replace illegal chars.

        var url = window.location.href;                                   // Get the URL.
        var parameters = url.substring(url.indexOf("?") + 1).split("&");  // Split by "param=value".
        var params = [];                                                  // Array to store individual values.

        for(var i = 0; i < parameters.length; i++)
            if(parameters[i].search(return_this + "=") != -1)
                return parameters[i].substring(parameters[i].indexOf("=") + 1).split("+");

        return "Parameter not found";
    }

console.log(get_param("parameterName"));

Regex n'est pas la solution idéale, pour ce type de problème, une simple manipulation de chaîne peut fonctionner énormément plus efficacement. Code source .

0
George Anthony