Wie lade ich ein einzelnes Div, ohne die gesamte Seite zu laden und den Ladestatus anzuzeigen?

Ich mache das:

Zuerst haben Sie das versteckte Div mit einem Lade-If und einem Lade-Button:

<div id="displayDiv" style="display: none">
  <img id="loadingGif" src="loadingGif" style="display:none"; />
  <div id="actualContent" style="display:none" />
</div>
<input type="button" id="loadButton" />

Dann haben Sie den JS-Code (ich verwende jQuery)

<script type="text/javascript">
   $(document).ready( onDocumentReady); // this runs before page load

   function onDocumentReady()
   {
      $('#loadButton').click( onLoadClick ); //assign action on button click
   }   

   function onLoadClick()
   {
       $('#loadingGif').show(); // show the loading gif. It won't show as long as it's parent is hidden
       $('#actualContent').hide(); // hide the actual content of the response;
       $('#displayDiv').show(); // display the div
       $.get("test.php", onRequestComplete ); // make the ajax request to the stand alone PHP file
      //so as long as the content loads, the loading gif will show;
   }

   function onRequestComplete( data )
   {
      $('#loadingGif').hide();
      $('#actualContent').html( data );
      $('#actualContent').show();
   }
</script>

So. Sie haben einen Container "displayDiv"; darin haben Sie ein Bild "loadingGif" und einen weiteren Container "actualContent"; Wenn Sie auf die Ladeschaltfläche klicken, wird der große Container mit dem Lade-GIF angezeigt, der den Benutzer darüber informiert, dass etwas geladen wird. Wenn der Inhalt geladen ist, blenden Sie einfach das loadingGif aus und zeigen die Informationen im "actualContent"-Gif an. In der test.php geben Sie einfach wieder, was im div erscheinen muss. Ich empfehle die Verwendung von JSON, aber Sie werden mehr darüber lesen.

Hoffe das hilft.