Wie kann ich den Inhalt einer Webseite ohne Aktualisierung mithilfe von JavaScript und AJAX aktualisieren?

Aktualisieren von Seiteninhalten ohne Aktualisierung mithilfe von Javascript und AJAX

Sie können die Funktionalität zum Aktualisieren des Inhalts eines Divs ohne Aktualisierung der Seite mithilfe von erreichen JavaScript und AJAX. So können Sie es machen:

Da die Onclick-Handler im Browser ausgeführt werden, können PHP-Funktionen nicht direkt aufgerufen werden. Fügen Sie stattdessen eine JavaScript-Funktion hinzu, die AJAX verwendet, um Daten aus einem PHP-Skript abzurufen. Mit jQuery können Sie den folgenden Code verwenden:

function recp(id) {
  $('#myStyle').load('data.php?id=' + id);
}

Erstellen Sie eine separate PHP-Datei (data.php in diesem Beispiel) und platzieren Sie Ihren PHP-Code darin:

require ('myConnect.php');     
$id = $_GET['id'];
$results = mysql_query("SELECT para FROM content WHERE  para_ID='$id'");   
if( mysql_num_rows($results) > 0 )
{
 $row = mysql_fetch_array( $results );
 echo $row['para'];
}

In Aktualisieren Sie im HTML Ihre Links, um die JavaScript-Funktion zu nutzen:

<a href="#" onClick="recp('1')" > One   </a>
<a href="#" onClick="recp('2')" > Two   </a>
<a href="#" onClick="recp('3')" > Three </a>

<div>

Durch Klicken auf diese Links wird der Inhalt des Div (mit der ID „myStyle“) angezeigt aktualisiert werden, ohne dass die Seite neu geladen werden muss. Die jQuery-Funktion lädt die Daten dynamisch über AJAX aus dem PHP-Skript und stellt so sicher, dass der Benutzer die aktualisierten Informationen sieht, ohne auf eine Seitenaktualisierung warten zu müssen.

Das obige ist der detaillierte Inhalt vonWie kann ich den Inhalt einer Webseite ohne Aktualisierung mithilfe von JavaScript und AJAX aktualisieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!