Идентификатор фрагмента URL-адреса - упрощение обработки состояния (javascript)

Question

У меня есть веб-приложение, которое широко использует идентификатор фрагмента для обработки «состояния».

examplesite.com/#$mode=direct$aa;map=t;time=2003;vid=4;vid=7 

ряд вопросов:

1) Что такое хороший способ присвоения различных «location.hash имени ценностных паров» переменные, чтобы следить за состояние?

1a) Должен ли я создать объект, который отслеживает состояние в js или объявляет глобальные переменные для каждой пары значений имени?

1b) Есть ли хорошие плагины jquery, чтобы упростить это?

1c) Если я хочу отслеживать что-то, называемое «цвет», - если оно всегда добавляется к фрагменту (#) и каков правильный способ проверки, если он определен; можно ли улучшить код ниже?

var color; 

var hashString = location.hash; 
var nvPairs = hashString.split(";"); 
var nvPair = new Array(); 

for (i = 0; i < nvPairs.length; i++) 
{ 
    var keyValuePair = nvPairs[i].split("="); 
    nvPair[keyValuePair[0]] = keyValuePair[1]; 
} 

if (nvPair['color']) color = nvPair['color'];  

1d) Поскольку некоторые имена используются дважды («VID» в примере выше) - как я мог легко хранить их в отдельные переменные?

2) Есть 4 различных "хэши" Я хочу обратить особое внимание на:

examplesite.com/ (не хэш)
examplesite.com/#example=5 (содержит "пример")
examplesite.com/#time=2003;vid=4;vid=7;modified=5 (содержит "модифицированный")
examplesite.com/#time=2003;vid=4; vid = 7 (не содержит «измененный» или «пример»)

Как бы вы написали структуру управления, которая извлекает переменные из хеша при загрузке приложения и проверяет вышеуказанные условия?

3) Как сохранить предыдущее состояние/состояние и как вызвать изменение состояния при нажатии кнопки «Назад»?

Answer 1

Я просто хотел бы использовать объект, содержащий массивы, вместо массива. Код будет выглядеть примерно так:

var color; 

var keyValuePair, 
    hashString = location.hash, 
    nvPairs = hashString.split(";"), 
    nvPair = {}; 

for (var i = 0; i < nvPairs.length; ++i){ 
    keyValuePair = nvPairs[i].split("="); 
    if (keyValuePair[0] in nvPair) 
     nvPair[keyValuePair[0]].push(keyValuePair[1]); 
    else 
     nvPair[keyValuePair[0]] = [keyValuePair[1]]; 
} 

if ('color' in nvPair) color = nvPair['color'][0]; 

Answer 2

Я считаю, что BBQ от Бен Alman может помочь вам: http://benalman.com/projects/jquery-bbq-plugin/

Answer 3

немного поздно на это, но JQuery 1.9 вызывает проблемы на плагин Бена ($.браузер)

раздвоенным исправленный вариант можно найти здесь:
https://github.com/georgekosmidis/jquery-hashchange

И плагин, чтобы помочь справиться с изменениями хэш здесь:
https://github.com/georgekosmidis/jquery-hashhandle

Подробнее об этом здесь:
http://mycodepad.wordpress.com/2013/12/19/jquery-making-ajax-applications-crawlable/