Получить значения URL параметров строки запроса с помощью jQuery/Javascript (querystring)
Кто-нибудь знает хороший способ написать расширение jQuery для обработки параметров строки запроса? Я в основном хочу расширить функцию jQuery magic ($)
, чтобы я мог сделать что-то вроде этого:
$('?search').val();
Который дал бы мне значение "тест" в следующем URL-адресе: http://www.example.com/index.php?search=test
.
Я видел много функций, которые могут делать это в jQuery и Javascript, но я действительно хочу расширить jQuery для работы точно так, как показано выше. Я не ищу плагин jQuery, я ищу расширение для метода jQuery.
Ответы
Ответ 1
Нашел этот драгоценный камень от наших друзей в SitePoint. https://www.sitepoint.com/url-parameters-jquery/.
Использование PURE JQuery. Я просто использовал это, и это сработало. Подправил это, например, ради.
//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]
Используй как хочешь.
Ответ 2
Зачем расширять jQuery? Какая польза от расширения jQuery и просто наличия глобальной функции?
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/
Альтернативным подходом будет анализ всей строки запроса и сохранение значений в объекте для последующего использования. Этот подход не требует регулярного выражения и расширяет объект window.location
(но может также легко использовать глобальную переменную):
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/
В этой версии также используется Array.forEach()
, который недоступен изначально в IE7 и IE8. Его можно добавить, используя реализацию в MDN, или вы можете использовать jQuery $.each()
.
Ответ 3
Плагин JQuery jQuery-URL-Parser выполняет ту же работу, например, чтобы получить значение параметра строки поискового запроса, вы можете использовать
$.url().param('search');
Эта библиотека активно не поддерживается. Как предполагает автор того же плагина, вы можете использовать URI.js.
Или вы можете использовать вместо этого js-url. Это очень похоже на приведенный ниже.
Таким образом, вы можете получить доступ к параметру запроса, например $.url('?search')
Ответ 4
Это не мой пример кода, но я использовал его в прошлом.
//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');
Ответ 5
После многих лет уродливого анализа строк, есть лучший способ: URLSearchParams Давайте посмотрим, как мы можем использовать этот новый API для получения значений из местоположения!
//Предполагая, что "? 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"
ОБНОВЛЕНИЕ: IE не поддерживается
используйте эту функцию вместо URLSearchParams
$.urlParam = function (name) {
var results = new RegExp('[\?&]' + name + '=([^&#]*)')
.exec(window.location.href);
if (results == null) {
return 0;
}
return results[1] || 0;
}
console.log($.urlParam('action')); //edit
Ответ 6
Я написал небольшую функцию, где вам нужно только проанализировать имя параметра запроса. Итак, если у вас есть:? Project = 12 & Mode = 200 & date = 2013-05-27, и вам нужен параметр "Mode", вам нужно только проанализировать имя "Mode" в функции:
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');
Ответ 7
Основываясь на ответе @Rob Neild выше, вот чистая адаптация JS, которая возвращает простой объект декодированных параметров строки запроса (без %20 и т.д.).
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;
}
Ответ 8
Написано в 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.
Ответ 9
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;
}
Я использую это.