Existe uma forma sem plugins de recuperar valores query string via jQuery (ou sem)?
Se sim, como? Se não, há algum plugin que o possa fazer?
**Atualização: Set-2018***
Você pode usar URLSearchParams que é simples e tem suporte decente (mas não completo) ao navegador.
const urlParams = new URLSearchParams(window.location.search);
const myParam = urlParams.get('myParam');
**Original***
Você não precisa de jQuery para esse propósito. Você pode usar apenas algum JavaScript puro:
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, '\\$&');
var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, ' '));
}
Usagem:
// query string: ?foo=lorem&bar=&baz
var foo = getParameterByName('foo'); // "lorem"
var bar = getParameterByName('bar'); // "" (present with empty value)
var baz = getParameterByName('baz'); // "" (present with no value)
var qux = getParameterByName('qux'); // null (absent)
Nota: Se um parâmetro estiver presente várias vezes (?foo=lorem&foo=ipsum
), você receberá o primeiro valor (lorem
). Não há um padrão sobre isto e os usos variam, veja por exemplo esta pergunta: Posição autorizada das chaves de consulta HTTP GET duplicadas.
NOTA: A função é sensível a maiúsculas e minúsculas. Se preferir o nome de parâmetro que não diferencia maiúsculas de minúsculas, adicionar 'i' modificador ao RegExp.
Esta é uma atualização baseada nas novas especificações URLSearchParams para alcançar o mesmo resultado de forma mais sucinta. Veja a resposta intitulada "URLSearchParams" abaixo.
Roshambo no snipplr.com tem um script simples para conseguir isso descrito em Obter Parâmetros de URL com jQuery | Improved. Com o seu script você também consegue facilmente extrair apenas os parâmetros que você quer.
Aqui está a essência:
$.urlParam = function(name, url) {
if (!url) {
url = window.location.href;
}
var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(url);
if (!results) {
return undefined;
}
return results[1] || undefined;
}
Depois basta obter os seus parâmetros a partir da cadeia de consulta.
Então, se a URL/caderno de consulta fosse xyz.com/index.html?lang=de
.
Basta chamar var langval = $.urlParam('lang');
, e você o tem.
UZBEKJON tem um ótimo post no blog sobre isso também, Obter parâmetros e valores de URL com jQuery.
Se você estiver usando jQuery, você pode usar uma biblioteca, como jQuery BBQ: Back Button & Query Library.
...jQuery BBQ fornece um método completo
.deparam()
, juntamente com o gerenciamento do estado do hash, e os métodos de fragmentação / query string parse e merge utility.
Editar: Adicionando Exemplo Deparam:
var DeparamExample = function() {
var params = $.deparam.querystring();
//nameofparam is the name of a param from url
//code below will get param if ajax refresh with hash
if (typeof params.nameofparam == 'undefined') {
params = jQuery.deparam.fragment(window.location.href);
}
if (typeof params.nameofparam != 'undefined') {
var paramValue = params.nameofparam.toString();
}
};
Se quiser usar apenas o JavaScript, pode usar...
var getParamValue = (function() {
var params;
var resetParams = function() {
var query = window.location.search;
var regex = /[?&;](.+?)=([^&;]+)/g;
var match;
params = {};
if (query) {
while (match = regex.exec(query)) {
params[match[1]] = decodeURIComponent(match[2]);
}
}
};
window.addEventListener
&& window.addEventListener('popstate', resetParams);
resetParams();
return function(param) {
return params.hasOwnProperty(param) ? params[param] : null;
}
})();
Por causa da nova API de histórico HTML e especificamente history.pushState()
e history.replaceState()
, a URL pode mudar o que invalidará o cache de parâmetros e seus valores.
Esta versão irá actualizar o seu cache interno de parâmetros cada vez que o histórico mudar.