2017-02-26 1 views
0

Ich bin neu in diesem Bereich. Ich baue eine Navbar mit Bootstrap 3 und die "load" -Funktion. Wenn ich die Zurück-Schaltfläche des Browsers verwenden möchte, funktioniert es nicht. Was muss ich tun, damit es funktioniert?Verlaufsfunktion für bootstrap navbar und jquery load-function

Hier meine vereinfachte Code:

index.html:

<nav class="navbar navbar-inverse navbar-fixed-top text-center"> 
    <div class="container"> 
     <div id="navbar" class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav navbar-right"> 
       <li><a href="#" onclick="$('#main').load('files/link1.html'); return false;">Link1</a></li> 
       <li><a href="#" onclick="$('#main').load('files/link2.html'); return false;">Link2</a></li> 
      </ul> 
     </div> 
    </div> 
</nav> 

Dank Schulz

+0

Was bedeutet 'Wenn ich den Zurück-Button des Browsers verwenden möchte, funktioniert es nicht '? Bitte versuchen Sie genauer zu sein - was erwarten Sie, wenn Sie auf die Zurück-Schaltfläche klicken - Wenn Sie möchten, dass sich der Browser an den Verlauf Ihrer Arbeit erinnert, dann müssen Sie ihm sagen - suchen Sie hier nach "manuell hinzufügen zu Geschichte " –

+0

Was ich meine, drücke ich zuerst Link1, dann Link2. Der Inhalt von Link2 wird angezeigt. Dann drücke ich den Zurück-Button des Browsers. Nun sollte der Inhalt von Link1 geladen und angezeigt werden. – WSchulz

Antwort

0

Es gibt keine einfache Möglichkeit, dies zu tun. Sie müssten das Objekt history verwenden und die URL jedes Mal ändern, wenn Sie auf etwas klicken, auf das Sie später zurückkommen möchten.

Grundsätzlich auf klicken Sie nicht nur den Remote-Inhalt laden, sondern auch die URL aktualisieren. Sie müssten auch einen Hash (#) in der URL verwenden, damit die Seite nicht aktualisiert wird. Dies bedeutet, dass ein Routing Mechanismus für Ihre App erstellt wird.