Получить URL параметры и значения с помощью JQuery
В этой статье я хотел бы поделиться небольшим отрывком кода JQuery, который делает получение URL параметров и их значений более удобным.
Недавно, во время работы на одном из моих проектов, я должен был получить значения параметров из URL строки на текущей странице, которая была построена и присланна сценарием PHP.
// Считывает GET переменные из URL страницы и возвращает их как ассоциативный массив. function getUrlVars() { 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; }Функцию getUrlVars() можно записать с использованием регулярных выражений:
function getUrlVars() { return window.location.href.slice(window.location.href.indexOf('?')).split(/[&?]{1}[\w\d]+=/); }
Функция возвращает массив / объект с URL параметров и их значений. Для примера рассмотрим URL:
http://www.example.com/?me=myValue&name2=SomeOtherValue
Вызов функции getUrlVars()
вернет вам следующий массив:
{ "me" : "myValue", "name2" : "SomeOtherValue" }
Чтобы получить значение первого параметра вы должны сделать следующее:
var first = getUrlVars()["me"]; // Для получения второго параметра
var second = getUrlVars()["name2"];
Для того, чтобы синтаксис сценария был более похож на код JQuery я переписал его как расширение для 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]; } });
Теперь, если вы добавить выше предоставленный код в файл JavaScript, вы можете получить URL значения параметров в следующем виде:
//Получить объект с URL параметрами
var allVars = $.getUrlVars(); // Получит параметр URL по его имени
var byName = $.getUrlVar('name');