Чи існує спосіб без плагінів отримати значення рядок запиту за допомогою jQuery (або без нього)?
Якщо так, то як? Якщо ні, то чи існує плагін, який може це зробити?
**Оновлення: вересень 2018 року
Ви можете використовувати URLSearchParams, який є простим і має пристойну (але не повну) підтримку браузерів.
const urlParams = new URLSearchParams(window.location.search);
const myParam = urlParams.get('myParam');
Оригінал
Для цього вам не потрібен jQuery. Ви можете використовувати просто чистий JavaScript:
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, ' '));
}
Використання:
// 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)
Примітка: Якщо параметр зустрічається кілька разів (?foo=lorem&foo=ipsum
), ви отримаєте перше значення (lorem
). Стандарту щодо цього не існує, і використання варіюється, див., наприклад, це питання: Авторитетна позиція дублікатів ключів HTTP GET запитів.
ПРИМІТКА: Функція чутлива до регістру. Якщо ви віддаєте перевагу нечутливому до регістру імені параметра, додайте модифікатор 'i' до RegExp.
Це оновлення, засноване на нових URLSearchParams специфікаціях для досягнення того ж результату більш лаконічно. Дивіться відповідь під назвою "URLSearchParams" нижче.
Roshambo на snipplr.com має простий скрипт для досягнення цього, описаний в Get URL Parameters with jQuery | Improved. За допомогою його скрипта ви також легко зможете витягнути саме ті параметри, які вам потрібні.
Ось суть:
$.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;
}
Потім просто отримайте ваші параметри з рядка запиту.
Отже, якщо URL/рядок запиту був xyz.com/index.html?lang=de
.
Просто викличте var langval = $.urlParam('lang');
, і все готово.
У UZBEKJON є чудова стаття про це в блозі, Отримання параметрів URL та їх значень за допомогою jQuery.
Якщо ви використовуєте jQuery, ви можете скористатися бібліотекою, наприклад, jQuery BBQ: Back Button & Query Library.
...jQuery BBQ надає повноцінний метод .deparam()
разом з управлінням хеш-станом, а також методами розбору фрагментів / рядка запиту і злиття утиліт.
Редагування: Додавання прикладу 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();
}
};
Якщо ви хочете просто використовувати звичайний JavaScript, ви можете використовувати...
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;
}
})();
Через новий HTML History API, а саме history.pushState()
та history.replaceState()
, URL-адреса може змінитися, що призведе до недійсності кешу параметрів та їх значень.
Ця версія буде оновлювати свій внутрішній кеш параметрів при кожній зміні історії.