Исключение для функции hashchange - история браузера назад? - PullRequest
Новая
       25

Исключение для функции hashchange - история браузера назад?

1 голос
/ 03 января 2012

Я понятия не имею, как мне вообще называть эту проблему… название вопроса вообще не имеет никакого смысла, я знаю!

Следующий случай: у меня есть одностраничный макет, где пользователипрокрутите вниз.У меня есть разделы .layer, которые, когда внутри области просмотра должны изменить хэш в адресной строке на id.Так, например, .layer#one находится внутри области просмотра, URL-адрес в адресной строке выглядит следующим образом: www.whever.com/#!/one

$(window).scroll(function() {       
    hash = $('.layer:in-viewport').attr('id');
    top.location.hash = "!/" + hash;
});

Это прекрасно работает и именно так, как я этого хочу.Причина, по которой у меня есть этот синтаксис с !/, заключается в том, что если бы я просто установил местоположение на hash, только поведение прокрутки было бы ошибочным, потому что браузер пытается придерживаться позиции хеша.

Теперь проблема в том, что я хочу, чтобы кнопка возврата истории браузера работала!Обычно это было бы довольно просто с функцией hashchange, которая поставляется с jQuery, например так: 

$(window).bind( 'hashchange', function( event ) {
    //query the hash in the addressbar and jump to its position on the site
});

Единственная проблема, с которой я столкнулся, заключается в том, что функция hashchange также будет запускаться, если хеш изменяетсяпрокрутки.Таким образом, он снова будет прыгать или придерживаться текущей позиции в браузере.Любая идея, как я мог решить это?Я мог бы, вероятно, убрать хэш-обмен во время прокрутки, верно?Но разве это лучшее решение?

1 Ответ

2 голосов
/ 04 января 2012

Конечно, вы можете просто отсоединять и перепривязывать всякий раз, когда хэш изменяется при прокрутке.Например: 

var old_hash;

var scroller = function() {       
    hash = $('.layer:in-viewport').attr('id');

    if ( old_hash != hash ) {
      $(window).off('hashchange', GoToHash); // using jQuery 1.7+ - change to unbind for < 1.7
      top.location.hash = "!/" + hash;

      setTimeout(function() { // ensures this happens in the next event loop
        $(window).on('hashchange', GoToHash);
      }, 0);

      old_hash = hash;
    }
}

var GoToHash = function() {
  //query the hash in the addressbar and jump to its position on the site
}

$(window).scroll(scroller);
...