Gibt es eine Möglichkeit normale Links automatisch durch Ajax machen laden, anstatt normal?

StackOverflow https://stackoverflow.com/questions/1449074

Frage

Ich habe das nicht gut erklärt.

Aber was ich meine ist, wenn ich einen Ajax-Skript, das den Inhalt einer Seite in einem DIV-Element lädt, durch die Funktion ‚loadpage (‘ whatever.php ') ;, anstatt zu gehen um manuell dies alles tun Links gibt es eine Möglichkeit, ein Skript zu haben, die automatisch alle regulären Links geladen werden durch diese ajax-Funktion macht?

Wie auf Facebook, Ihr Profil Lasten durch Ajax, doch wenn man sich ihren Code aussieht, haben sie nur eine regelmäßige Verbindung zum Profil.

Cheers!

War es hilfreich?

Lösung

Sicher, können Sie es mit jQuery tun.

Dieses Skript geht durch das Dokument, jedes Ankerelement findet und bindet einen Ereignishandler das Click-Ereignis von jedem. Wenn das Ankerelement geklickt wird, findet der Event-Handler das Attribut href und lädt diese Seite in #targetDiv (Sie dieses div nennen kann, was auch immer Sie natürlich wollen). 

<script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
  $("a").click(function() {
    $("#targetDiv").load(($(this).attr("href") + " body");
    return false;
  });
});
</script>

...

<!-- In your document body, this is the div you'd load the pages into. -->
<div id="targetDiv"></div>

Andere Tipps

Sie können JQuery verwenden für diese (wenn ich Ihre Frage richtig verstanden).

Zuerst können Sie die Funktion loadpage () machen wie folgt: 

function loadpage(divId, url) {
    $('#' + divId).load(url);

    return false;
}

.load () wird allerdings nicht von allen Browsern unterstützt. Wenn Sie dies tun wollen, ohne .load (), dann können Sie überprüfen .get (). Für weitere Informationen über .load (), werfen Sie einen Blick auf http://docs.jquery.com/Ajax / laden

Ich nehme an, es so etwas wie dies gehen würde: 

$(document).ready(function(){
    $("a").click(function(){
        $("body").load($(this).attr("href") + " body");
        return false;
    });
});

Dies würde alle <a> Tags auf der Seite machen eine Funktion aufrufen, die ein HTML-Dokument aus dem href Attribut des Tags herunterlädt, seinen Body-Tag Streifen aus, und den Inhalt der aktuellen Seite Body-Tag mit dem Inhalt des neuen ersetzen Body-Tag. Auf diese Weise ist es einfacher, dies ohne JavaScript zu arbeiten, sowie eine Integration in eine bestehende Website.

Um es zu nutzen, legen Sie diese in einen <script> Tag im Kopf Ihrer Haupt-Seite oder in einer externen JS-Datei.

Bitte beachten Sie jedoch, dass dieser Code aktualisiert nur den Inhalt des <body>-Tages, der Kopf (einschließlich dem Titel-Tag) bleibt unberührt. Unter Umständen müssen Sie zusätzlichen Code hinzufügen Dinge wie diese zu aktualisieren.

Einfach und Nizza. Check this out: Bjax

Verbrauch: 

<script src="bjax.min.js" type="text/javascript"></script>
<link href="bjax.min.css" rel="stylesheet" type="text/css" />

Schließlich sind diese in den Kopf Ihrer html: 

$('a').bjax();

Für weitere Einstellungen, Kasse Demo hier: Bjax Demo

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top