Come posso rilevare un cambiamento barra degli indirizzi con JavaScript?
-
20-09-2019 - |
Domanda
Ho un Ajax applicazione pesante che potrebbe avere un URL come
http://example.com/myApp/#page=1
Quando un utente manipola il sito, la barra degli indirizzi può cambiare in qualcosa di simile
http://example.com/myApp/#page=5
senza ricaricare la pagina.
Il mio problema è la seguente sequenza:
- Un utente segnalibri il primo URL.
- L'utente manipola l'applicazione in modo tale che la seconda URL è lo stato attuale.
- L'utente fa clic sul segnalibro creata nel passaggio 1.
- l'URL nella barra degli indirizzi modifiche da http://example.com/myApp/#page= 5 a http://example.com/myApp/#page=1 , ma non so di un modo per rilevare il cambiamento è avvenuto.
Se rilevo una modifica alcuni JavaScript avrebbe agito su di esso.
Soluzione
HTML5 introduce un hashchange evento che consente di registrare per le notifiche di modifiche url hash senza polling per loro con un timer.
E 'supportata da tutti i principali browser (Firefox 3.6, IE8, Chrome, altri browser basati su WebKit), ma mi piacerebbe ancora altamente consiglia di utilizzare una libreria che gestisce l'evento per voi - vale a dire utilizzando un timer nei browser non sostenere l'evento HTML5 e utilizzando l'evento altrimenti.
Per ulteriori informazioni sulla manifestazione, consultare https://developer.mozilla.org/ it / dom / window.onhashchange e http :. //msdn.microsoft.com/en-us/library/cc288209%28VS.85%29.aspx
Altri suggerimenti
controllare l'indirizzo corrente periodicamente usando setTimeout / intervallo:
var oldLocation = location.href;
setInterval(function() {
if(location.href != oldLocation) {
// do your action
oldLocation = location.href
}
}, 1000); // check every second
Si dovrebbe estendere l'oggetto posizione per esporre un evento che è possibile associare a.
vale a dire:
window.location.prototype.changed = function(e){};
(function() //create a scope so 'location' is not global
{
var location = window.location.href;
setInterval(function()
{
if(location != window.location.href)
{
location = window.location.href;
window.location.changed(location);
}
}, 1000);
})();
window.location.changed = function(e)
{
console.log(e);//outputs http://newhref.com
//this is fired when the window changes location
}
SWFAddress è un ottimo libreria per questo tipo di cose.