2012-09-10 4 views
8

Ich erstelle ein Skript, um den Browser zurück zu laden und die vorherige Seite zu laden. Ich bin neu in jQuery und Javascript (eine PHP-Person). Bevor ich das erfand, habe ich das ganze Web nach einer Bibliothek durchsucht. Aber da ich viele Parameter in meinen Ajax-Links verwende, kann ich diese Bibliotheken nicht verwenden. Ich gebe zu, es ist mein Fehler, weil ich nicht weiß, wie man solche komplexen Systeme benutzt. So denke ich, wenn ich ein System wie folgt erstelle.Hören Browser zurück Schaltfläche, wenn Sie AJAX verwenden und speichern Sie die HTML-Daten als ein Objekt. Gut oder schlecht?

// get the contents of a particular div and save as an object/associative array 
// { hash : pageNumber, html : content} 
function save_history(div){ 
    var content = $(div).html(); 
    // increment the page number and add hash tags to the URL 
} 

// Listen to the browser hash value change 
$(window).bind('hashchange', function() { 
    hash = window.location.hash; 
    if(hashValue){ 
     load_history(hashValue); 
    } 
}); 

// Load data from history 
function load_history(id){ 
    // fetch the content based on the hashvalue 
    $(div).html(content); 
} 

Gibt es ein Problem bei der Verwendung dieses? Werden die Seiten dadurch nicht mehr reagieren oder den Browser zum Absturz bringen, wenn viele Inhalte als Objekte gespeichert werden? Ich möchte meine Zeit nicht verschwenden, wenn es solche Probleme verursacht.

+0

Warum sind die standardmäßigen Browserimplementierungen nicht akzeptabel? Machst du eine sehr schwere AJAX Web-App? Ich meine Browser in diesen Tagen machen alle Arten von Caching, warnen Sie, wenn Sie versuchen, zu einer POST-Anfrage usw. zurückzugehen usw. – thatidiotguy

+0

@thatiidiotguy: Ja, das ganze System ist ajaxified. Ich plane nicht, die Formulareinreichungen zwischenzuspeichern. Nur alle Ansichten. – Mic

+0

Dann bekommst du eine Verbesserung, da ich dafür auch keine Best Practices kenne. – thatidiotguy

Antwort

0

Wenn Sie vorhaben, HTML5 zu verwenden, werfen Sie einen Blick auf die History-API. Es ermöglicht die Verwendung von nativen Browsersteuerelementen in AJAX Web Apps. Schau mal!

http://diveintohtml5.info/history.html

+0

Danke für den Link. Aber ich habe das früher gesehen. Meine Seiten werden mit vielen Parametern erstellt. Ich bin mir also nicht sicher, wie ich dieses System benutzen soll – Mic

0

Die Geschichte API ist der Weg zu gehen. Es spielt keine Rolle, ob Ihre Seiten mit vielen Parametern erstellt werden. Wenn sie über URL-Parameter verfolgt werden, sollte der Verlauf der Seite (durch die die URL aktualisiert wird) wiederhergestellt werden. Wenn Sie keine URL-Parameter verwenden (dh Sie verwenden POST oder eine benutzerdefinierte Lösung), akzeptiert history.pushState() drei Parameter: status, der ein beliebiges Objekt sein kann (z. B. die Serialisierung Ihrer Formulardaten) Titel, dann die URL der "neuen" Seite. Wenn Sie dann zurückschlagen, führen Sie history.popState() aus, das alle die gleichen Parameter zurückgibt, und Sie können diese Parameter dann analysieren, um den "vorherigen" Status Ihrer Seite wiederherzustellen.

Im Ernst, lesen Sie den Artikel howderek zu enger miteinander verbunden, oder diese andere Frage überprüfen, die Links zu vielen anderen Tutorials zur Verwendung der Geschichte API hat: Good tutorial for using HTML5 History API (Pushstate?)

Verwandte Themen