2016-10-16 38 views
6

Funkcja history.back() ma cofnąć jeden krok w historii utworzonej przy użyciu interfejsu API historii HTML5. Poniższy kod działa zgodnie z oczekiwaniami w Firefox, ale nie w Chrome:Funkcja history.back() nie działa z interfejsem API historii HTML5 zgodnie z oczekiwaniami w Chrome

<html> 
    <script type="text/javascript"> 
     history.replaceState({path: '/home'}, '', '?page=home'); 
     history.pushState({path: '/second'}, '', '?page=second'); 
     console.log(history.state.path); // says "/second" 
     history.back(); 
     console.log(history.state.path); // says "/second" but should say "/home" 
    </script> 
</html> 

W Chrome, drukuje /second zarówno razy, natomiast po powrocie powinien wydrukować /home. Czy czegoś brakuje?

+0

Czy ma taki sam efekt, gdy używa się 'history.go (-1);' zamiast 'history.back();'? – TheRealVira

+0

Tak, zarówno 'history.back()' jak i 'history.go (-1)' zachowują się dokładnie tak samo. – ccrisan

+0

Zazwyczaj to naprawia ... Było też coś w rodzaju chromowania, w którym musisz "zwrócić false" po wywołaniu 'history.go (-1);'. – TheRealVira

Odpowiedz

3

W Chrome history.back/history.forward/history.go nie są zsynchronizowane z history.state. I encountered this issue a while back while working on PDF.js i zgłosił to w narzędziu do śledzenia błędów Chromium: https://crbug.com/510026. Nic z tego nie wyszło.

obejście jest użycie popstate event wykryć, kiedy zakończy nawigacyjne:

history.replaceState({path: '/home'}, '', '?page=home'); 
history.pushState({path: '/second'}, '', '?page=second'); 
console.log(history.state.path); // says "/second" 

addEventListener('popstate', function(event) { 
    console.log(history.state.path); // says "/home" 
    // You can also use console.log(event.state); 
}, {once: true}); 
history.back(); // Will asynchronously change history.state 

Uwaga: addEventListener z parametrem once jest obsługiwana tylko w Chrome 55 - przed, że trzeba zadzwonić removeEventListener w detektor, jeśli chcesz, aby detektor działał jeden raz, tak:

addEventListener('popstate', function listener(event) { 
    removeEventListener('popstate', listener); 
    console.log(history.state.path); // says "/home" 
    // You can also use console.log(event.state); 
}); 
+0

Mój problem z tym podejściem polega na tym, że kod polegający na nowym stanie jest całkowicie zsynchronizowany. Uczynienie go asynchronicznym sprawiłoby, że byłoby brzydkie i po prostu nie miałoby sensu. Wciąż czekam na poprawkę. Do tego czasu wyłączyłem całą powiązaną funkcję w Chrome. – ccrisan