Wie rufe ich MySQL-Daten mit jQuery AJAX ab und zeige sie auf einer Webseite an, ohne sie neu zu laden?

Verwenden von jQuery AJAX zum Abrufen von Daten aus MySQL

Mithilfe von AJAX (Asynchronous JavaScript und XML) mit jQuery können Sie Daten aus MySQL abrufen Datenbank importieren und auf einer Webseite anzeigen, ohne die gesamte Seite neu laden zu müssen. Um dies zu erreichen, befolgen Sie diese Schritte:

jQuery-AJAX-Code

In Ihre HTML-Datei fügen Sie die jQuery-Bibliothek ein und schreiben Sie den folgenden AJAX-Code:

<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        var response = '';
        $.ajax({
            type: "GET",
            url: "Records.php",
            async: false,
            success: function(text) {
                response = text;
            }
        });

        alert(response);
    });
</script>

PHP-Code

Stellen Sie in Ihrer Records.php-Datei eine Verbindung zur MySQL-Datenbank her und führen Sie die Abfrage aus, um die Datensätze abzurufen:

$con = mysql_connect("localhost","root","");
$dbs = mysql_select_db("simple_ajax",$con);
$query = "SELECT Name, Address FROM users";
$result = mysql_query($query);

// Create the response in HTML format
$html = "";
while ($row = mysql_fetch_array($result)) {
    $html .= "<tr>
<td>$row[Name]</td>
<td>$row[Address]</td>
</tr>";
}

echo $html;

Problem lösen

Der bereitgestellte Code funktioniert aus folgenden Gründen möglicherweise nicht für Sie:

• Ihre list.php enthält die Anweisung „alert(response)“ in der Funktion „ready“, die die leere Antwort vor der AJAX-Anfrage benachrichtigt abgeschlossen.
• Ihr Records.php-Code verwendet die veralteten mysql_*-Funktionen. Sie sollten mysqli_* oder PDO für die Datenbankkonnektivität verwenden.

Lösung

Um diese Probleme zu beheben, ändern Sie Ihren Code wie folgt folgt:

list.php

<script type="text/javascript">
    $(document).ready(function() {
        $.ajax({
            type: "GET",
            url: "Records.php",
            async: false,
            success: function(text) {
                $("#div1 h2").html(text);
            }
        });
    });
</script>

Records.php

<?php $mysqli = new mysqli("localhost", "root", "", "simple_ajax");
if ($mysqli->connect_error) {
    die("Connection failed: " . $mysqli->connect_error);
}

$result = $mysqli->query("SELECT Name, Address FROM users");

// Create the response in HTML format
$html = "";
while ($row = $result->fetch_array(MYSQLI_ASSOC)) {
    $html .= "<tr>
<td>{$row['Name']}</td>
<td>{$row['Address']}</td>
</tr>";
}

$mysqli->close();
echo $html;

Mit diesen Änderungen wird Ihr AJAX Der Code sollte erfolgreich Datensätze aus der MySQL-Datenbank abrufen und sie ohne Neuladen auf der Webseite anzeigen.

Das obige ist der detaillierte Inhalt vonWie rufe ich MySQL-Daten mit jQuery AJAX ab und zeige sie auf einer Webseite an, ohne sie neu zu laden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!