Как запускать различные функции при изменении хэша на основе хеш-значения с помощью jQuery?

Я использую плагин событий jQuery hashChange от Ben Alman. хэш-часть выглядит так:

#x=1&y=2&z=3

У меня уже есть функции, которые разбирают его getHashPart(key) и setHashPart(key).

Хотелось бы иметь функцию, которая позволяла бы регистрироваться с изменением только определенной части хеша. Я бы использовал его как таковой (я думаю...):

$(window).hashchange('x',function(new_value_of_x) {do something x related;});
$(window).hashchange('y',function(new_value_of_y) {do something y related;});

Как мне зарегистрировать такую ​​функцию с помощью jQuery? что-то подобное есть?

Спасибо!


person Ben    schedule 30.05.2011    source источник
comment
bennadel.com/blog/ объясняет, как настроить событие onchange для URL-адреса страницы. Однако, если вы делаете то, что я думаю, что вы делаете, вы должны связать ссылки, которые задают хэш для выполнения того, что вы хотите, а затем при загрузке документа проверьте, был ли какой-либо хеш в URL-адресе для выполнения действия, которое он должен.   -  person Niklas    schedule 30.05.2011
comment
Хорошая статья. Я подожду, чтобы увидеть другие предлагаемые решения.   -  person Ben    schedule 30.05.2011
comment
пс. На вашем месте я бы изменил заголовок вопроса на что-то вроде «Как запускать различные функции при изменении хэша на основе значения хеш-функции с помощью jQuery?». Просто предложение.   -  person Ege Özcan    schedule 30.05.2011


Ответы (1)


У вас может быть функция, которая реагирует на все события hashchange (предпочтительно сохраняя использование плагина hashchange), а затем перенаправляет на отдельные обработчики следующим образом:

var hashParameters = {};

$(window).bind("hashchange",function(event) {
//if you're using the awesome hashchange plugin
//$(window).hashchange(function(event) { ...
    var newParameters = getParameters(event.target.location.hash.substring(1));
    $.each(newParameters, function(key, value) {
       if(hashParameters[key] !== value) $(window).trigger(key + "-change");
       hashParameters[key] = value;
    });
});

$(window).bind("andsome-change", function() {
    alert("hi!");
});

function getParameters(paramString) {
    //taken from http://stackoverflow.com/questions/4197591/parsing-url-hash-fragment-identifier-with-javascript/4198132#4198132
    var params = {};
    var e, a = /\+/g, r = /([^&;=]+)=?([^&;]*)/g,
        d = function (s) { return decodeURIComponent(s.replace(a, " ")); };
    while (e = r.exec(paramString))
       params[d(e[1])] = d(e[2]);
    return params;
}

window.location.hash = "some=value&andsome=othervalue";

У меня есть рабочая демонстрация здесь (теперь с плагином hashchange, см. первый комментарий ).

person Ege Özcan    schedule 30.05.2011
comment
+1, к вашему сведению, вы можете включать внешние скрипты в jsFiddle - слева щелкните Добавить ресурсы и вставьте ссылку. Либо просто вставьте <script src="whatever" ></script> во фрейм HTML. - person Thomas Shields; 30.05.2011
comment
что я не мог, значит, я тоже был слишком ленив =)) большое спасибо за предложение, и вот ссылка с исправлением: jsfiddle.net/TuVBL/1 - person Ege Özcan; 30.05.2011