Dynamisch geladene Inhalte mit jQuery laden löscht den vorhandenen html

Question

Im Moment versuche ich ein Setup zu erstellen, bei dem der Seiteninhalt in den Hauptbereich geladen wird, um zu vermeiden, dass die Seite für jeden Link aktualisiert werden muss.

Ich verwende jQuery laden wie folgt für jeden Link, der angeklickt wird, so dass der Link in die #main geladen wird. (Offensichtlich ist es nicht alle Links, wenn Sie fertig sind.)

Seiten besucht direkt funktionieren gut, aber wenn Sie versuchen, diese Ladung Link zu verwenden, dann wird es den Inhalt korrekt laden, aber zeigt nur die geladene HTML in Sicht Quelle, Mache ich hier etwas falsch?

$("body").on("click", "a", function(){ 

    $("#footer, #main").fadeOut('fast'); 

    $("#main").load($(this).attr("href"), function(){ 

     $("#main, #footer").fadeIn('slow'); 

    }); 

    return false 
}); 

Answer 1

Das Problem, das dieses Problem mit .load() verursacht, ist, wenn die Datei, die Sie einschließen, <script></script> Tags enthält.

Diese stören das Javascript und es kann nicht mit der Seite zu Fehler führen.

Um das Problem zu beheben, müssen Sie die <script></script> Tags aus der geladenen Datei entfernen.

Answer 2

Sie verblasste die Haupt-out, und es nicht wieder verblassen ...
Verwenden Sie diese:

$("body").on("click", "a", function(){  
    $("#footer, #main").fadeOut('fast');  
    $("#main").load($(this).attr("href"), function(){  
     $("#main").fadeIn('slow'); // <====================== 
     //$(this).fadeIn('slow'); this isn't the main object! 
     $("#footer").fadeIn('slow');  
    });  

    return false 
}); 

this innerhalb der Rückruf nicht das DOM-Element ist !!!