Ho una pagina Web che utilizza history.pushState
con identificatori di frammento (ad esempio #Heading1
) e il metodo animate
di jQuery per navigare all'interno del documento.Chrome su iOS; indietro/avanti non funziona con history.pushState?
Questo è come naviga verso una posizione nel documento:
$('nav a').click(function(e){
e.preventDefault();
var href = $(this).attr('href');
history.pushState(null, null, href);
$('#address').val(location.pathname + href);
$('html, body').animate({
'scrollTop': $(href).offset().top + 'px'
});
Utilizzo di Google Chrome su iOS, l'indirizzo viene aggiornato come previsto e l'animazione di scorrimento funziona bene, ma i/pulsanti avanti indietro don' t vai ai tag identificati.
Devo notare che quando si utilizzano i pulsanti Indietro/Avanti, l'URL nella barra degli indirizzi è modificato. Semplicemente non va al tag identificato.
Ho visto questo problema solo con Google Chrome su iOS; sia iPhone che iPad.
Ho creato un Pen a CodePen con un sottoinsieme del mio codice che deve dimostrare il problema: http://codepen.io/Ghodmode/pen/YqKGga
Aggiornamento:
Ho aggiornato la mia penna per fare è un po 'più facile da testare su un iPhone/iPad. E 'probabilmente anche meglio usare la vista di debug: http://s.codepen.io/Ghodmode/debug/YqKGga
Aggiornamento 2:
ho creato un'altra pagina in CodePen che dovrebbero dimostrare il problema. Questa volta, senza jQuery: http://s.codepen.io/Ghodmode/debug/jqOqpq
Non sono stato in grado di testare questo ancora perché non ho accesso diretto a iPhone/iPad, ma davvero non credo che il problema abbia nulla a che fare con jQuery.
Funziona bene su:
- Safari su iPhone/iPad
- Google Chrome su Android
- Mozilla Firefox su Android
- Google Chrome su Windows
- Mozilla Firefox su Windows
- Internet Explorer su Windows
Probabilmente dovrei notare che non ho personalmente alcun dispositivo iOS per testarlo, ma ho un tester affidabile che mi invia video e screenshot di qualsiasi problema.
Poiché l'animazione funziona come previsto, non sembra un problema jQuery.
Non riesco a trovare nulla di sostanziale su questo, ma sono passato dalla ricerca di _chrome ios hashchange_ a _ios webview hashchange_ poiché Chrome su iOS è solo un'interfaccia utente racchiusa in UIWebView. – Vince
[Questo bug report Chromium] (https://bugs.chromium.org/p/chromium/issues/detail?id=559122) sembra confermare che Chrome su iOS non attiva l'evento 'hashchange' quando il pulsante Indietro viene cliccato, ma non riesco a immaginare come così poche persone abbiano notato questo. – Vince
Qualche aggiornamento su questo? Un anno dopo, vedo lo stesso problema, non posso modificare la cronologia (/ pulsante indietro) utilizzando Google Chrome su iOS, funziona su qualsiasi altra cosa, tra cui Safari su iOS. – adrianTNT