Идентификатор фрагмента URL - упрощение обработки состояний (JavaScript) - PullRequest
Новая
       7

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

6 голосов
/ 26 января 2010

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

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 (содержит "example")
examplesite.com/#time=2003;vid=4;vid=7;modified=5 (содержит «измененные»)
examplesite.com/#time=2003;vid=4;vid=7 (не содержит "модифицированные" или "примеры")

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

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

Ответы [ 3 ]

2 голосов
/ 30 января 2010

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

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];
1 голос
/ 26 января 2010

Я думаю, что барбекю от Бена Алмана может помочь вам: http://benalman.com/projects/jquery-bbq-plugin/

0 голосов
/ 29 ноября 2013

Немного поздно, но jQuery 1.9 вызывает проблемы с плагином Бена ($ .browser)

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

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

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

...