Zurück Button Event Listener

Question

Ich habe eine Single-Page-Anwendung. In der ersten Instanz zeige ich die Input-Seite und die Output Div ist zu diesem Zeitpunkt ausgeblendet. Wenn die Eingabedaten gesendet werden, verberge ich die Eingabedaten und Ajax verwenden, um die Ausgabe zu berechnen und die Ausgabe anzuzeigen Ergebnis in der Ausgabe div. Im Grunde ist die gleiche Seite sowohl für die Eingabe- als auch für die Ausgabeseite vorhanden. Jetzt habe ich eine Zurück-Schaltfläche, wenn Benutzer darauf klicken, wird das Eingabe-Div angezeigt und Ausgabe div ist ausgeblendet.

$("#renderOutput").on("click", "#chngeIcon", function() { 
    $('#renderOutput').hide(); 
    $('#InputPage').show(); 
}); 

Da es sich um eine einzelne Seite Anwendung, wenn der Benutzer klicken Sie auf den Browser zurück Knopf ist, als es zur vorherigen besuchte Seite genommen wird. Ich möchte einen Zurück-Knopf machen, um sich ähnlich wie mein Zurück-Knopf zu verhalten. Bitte hilf mir. enter image description here

Answer 1

können Sie versuchen, popstate Event-Handler, zB:

window.addEventListener('popstate', function(event) { 
    // The popstate event is fired each time when the current history entry changes. 



    if ($("#InputPage").is(":visible") == false) { 
     // Call Back button programmatically 
     history.back(); 
     // Uncomment below line to redirect to the previous page instead. 
     // window.location = document.referrer 
    } else { 
     // Stay on the current page. 
     history.pushState(null, null, window.location.pathname); 
     $('#renderOutput').show(); 
     $('#InputPage').hide(); 
    } 

    history.pushState(null, null, window.location.pathname); 

}, false); 

Hoffnung, die