Window.onpopstate, event.state == null?

Я прочитал несколько вопросов/ответов по Qaru и Googled, похоже, я не могу заставить event.state вернуться с чем-либо, кроме null.

Я понял, что он не будет работать с событием jQuery, но когда я делаю что-то вроде этого:

window.onpopstate = function (e) {
     console.log(e.state)
}

С чем-то вроде успеха jQuery.ajax, вызывающим

history.pushState({ lastUrl: data.State }, data.Title, data.UrlKey);

Ни Chrome (v19), ни Firefox (v12) не возвращают ничего, кроме null? Я что-то пропустил? Это просто не полностью реализовано?

Ответ 1

e.state относится ко второму последнему состоянию, которое было нажато. Для того чтобы не было null, вам нужно было как минимум дважды нажать на e.state. Это связано с тем, что вы должны сохранять состояние, когда ваш сайт загружается в первый раз, а затем каждый раз при изменении состояния.

Ответ 2

Я думаю, что этот вопрос нуждается в более ясном объяснении, потому что предложение "второе последнее состояние, которое было нажато" в других ответах может привести к путанице.

Когда мы делаем history.pushState, мы вставляем в стек истории новое состояние, которое становится текущим (как мы видим из url навигационной панели).

Событие window.onpopstate означает, что высвечивается верхнее состояние истории (отбирается из стека), поэтому e.state теперь укажет на новое новое верхнее состояние в стеке (поскольку панель навигации будет указывать к предыдущему URL-адресу).

Ответ 3

Я боролся с этой же проблемой в течение многих часов. Слишком много часов Аргумент состояния onpopstate -handler был нулевым, хотя я вызвал pushState() много раз, прежде чем я нажал кнопку возврата.

Я также заметил, что мой onclick -handler, который вызванный pushState() вызвал onpopstate -handler быть вызванным. Я полагаю, что на предстательной железе -handler должен вызываться только из-за нажатия пользователем на Кнопка назад из того, что я прочитал в Интернете. Но казалось, что это не так в моем случае.

Может ли быть ошибка в браузере? Кажется маловероятным, потому что у меня было то же самое или похожая проблема на Chrome и FireFox. Но возможно. Или может быть "ошибка в спецификации" быть слишком сложным для правильной реализации. Нет общедоступных юнит-тестов, показывающих, как это должно работать.

Наконец я пришел к решению, после которого ВСЕ начало работать. Это было поставить эти два вызова в моей загрузке -handler:

pushState (myInitialState, null, href);
pushState (myInitialState, null, href);

Так что я должен сделать тот же вызов push-state() ДВАЖДЫ в нагрузке -handler! После этого мой onpopstate -handler начал получать аргументы чье состояние было не нулевым, а состояние, которое у меня было ранее переданный в качестве аргумента для pushState().

Я не очень понимаю, почему это сейчас работает и почему это не было раньше, когда я позвонил только pushState ОДИН РАЗ.

Я хотел бы понять, почему это работает сейчас, но я уже провел слишком много времени с этим получением это на работу. Если кто-нибудь имеет ссылку на хорошее пример кода онлайн, который объясняет это было бы замечательно.

Ответ 4

Будет полезно, если вы когда-нибудь узнали о стеке отмен/повторов, как показано на рисунке ниже.

На самом деле, история хранится в стеке, как это. Ваше текущее состояние от текущего элемента стека, и пусть предположим, что есть указатель на него; когда вы вызываете history.back(), указатель переходит к более старому элементу стека, кстати, состояние события onpopstate совпадает с history.state. Вы просто получите элемент, на который в данный момент указывает указатель, который был изменен с помощью history.replaceState или добавлен с помощью history.pushState.

Этот процесс также объясняет, почему history.length не изменяется, потому что он представляет всю длину стека. Когда вы вызываете history.go(1), указатель возвращается к более новому элементу.

Когда указатель находится в средней позиции стека, вызов history.pushState приведет к тому, что все элементы над указателем вытолкнуты и добавлен новый, также вы можете увидеть изменения history'length.