2011-11-21 5 views
5

Ho iniziato a testare History.js. Dopo aver capito come funziona e che non ci sia popstate, invece c'è statechange. Sto cercando un modo per differenziare quando il pulsante Indietro del browser è stato premuto.C'è un modo in History.js di sapere quando è stato premuto il pulsante Indietro

Il motivo è che ho bisogno di conoscere l'URL prima che lo stato si trasferisca, da quello che sto per. Con il gist incluso nel progetto, viene visualizzato solo l'URL a cui andiamo.

Spero che la soluzione non sia tracciare l'ultimo URL visitato in una variabile globale.

Grazie

risposta

4

So che questa è una domanda piuttosto datato, ma mi si avvicinò a una soluzione ai problemi con il tasto avanti/indietro quando si passa da una pagina standard e una pagina di storia dello stato.

Scenario: Utilizzare HTML5 Storia (o history.js plugin) su una serie di pagine Poi altre pagine abbiamo bisogno carichi reali, alias una pagina standard (non chiedere perché, ma ci sono alcuni casi d'uso che questo potrebbe essere necessario)

Quando si passa da una pagina dello stato di cronologia e si esegue un carico reale su una pagina standard. Non puoi tornare indietro: cambia l'url, ma non carica la pagina - spara solo una statechange; che presumo sia il problema del post originale. La mia opinione personale è che questo è un bug del browser (tutti i browser hanno il problema, però), perché il browser dovrebbe sapere che la pagina su cui ci si trova è stata ricaricata al di fuori della pagina dello stato della cronologia.

Ho risolto il problema con qualcosa di veramente semplice: Ascoltando l'evento statechange e diciamo al browser di aggiornarsi quando si attiva. In questo modo non mi interessa se tornano o escono da questa pagina. Se il browser pensa che lo stato stia cambiando (i link non attivano l'evento statechange), solo back/forward INTO in una pagina di stato Cronologia attiva questo evento, quindi risolve il problema.

codice, utilizzando jQuery + History.js plugin:

$(window).on('statechange', function() { 
    window.location.reload(); 
}); 

Se questo non ha senso, si sta probabilmente non avere questo problema. Tuttavia, in molti siti ho notato che do utilizza la cronologia HTML 5 (anche pinterest.com presenta questo problema se si ricarica quando si è su un'immagine modale e quindi si tenta di tornare indietro).

Speriamo che, se si dispone di questo problema, troverete questa risposta e hanno un enorme sospiro di sollievo :)

+2

Avevo pensato a una logica simile, tuttavia, la commutazione di stato viene attivata quando si invia pushState e quando si preme back/forward, che crea un loop di ricarica infinito. – Dean

+0

In effetti, un enorme sollievo. Stavo per arrendermi. –

17

ho trovato le soluzioni su GitHub ad essere un po 'esagerati per i miei scopi. Ho creato un bool che è sempre vero tranne poco prima, quando ho usato History per cambiare lo stato.

var manualStateChange = true; 

History.Adapter.bind(window,'statechange',function(){ 
    if(manualStateChange == true){ 
    // BACK BUTTON WAS PRESSED 
    } 
    manualStateChange = true; 
}); 

Ogni volta che cambio dello stato a livello di codice, impostare il bool false:

manualStateChange = false; 
History.pushState(null, null, currentPath); 
+0

good thinking ... – JDandChips

+1

Ho fatto la stessa cosa, ma ciò non distingue tra i pulsanti "indietro" e "avanti". – GTCrais

+0

Questo è esattamente ciò di cui avevo bisogno, grazie: D ... Ho solo bisogno di 'location.reload()' nel bit '// BACK BUTTON PRESSED', quindi 'back' e 'forward' non sono un problema: D –

0

Nella versione 'ufficiale' questa funzione non è disponibile. Prova a utilizzare questo file nel frattempo: https://github.com/danger89/history.js/blob/master/scripts/bundled/html5/jquery.history.js

Non posso garantire che la sua soluzione funzioni per ogni browser. Ma è una bella soluzione. Se si è applicato i suoi cambiamenti, è possibile utilizzare:

var State = History.getState(); 
if (State.navigation) { 
    // Back/forward button is pressed. 
} 

Maggiori informazioni possono essere trovate sul Github issue 47.

0

Risposta simile a quella di James Wagoner. l'evento 'statechange' è stato sparato in entrambi i modi, quindi ho solo verificato un evento 'popstate', che nel mio caso viene chiamato solo quando l'utente torna indietro.