jQuery AJAX を使用して MySQL データを取得し、リロードせずに Web ページに表示する方法

jQuery AJAX を使用して MySQL からデータを取得する

AJAX (非同期 JavaScript および XML) と jQuery を使用すると、MySQL からデータを取得できますデータベースを保存し、ページ全体をリロードせずに Web ページに表示します。これを実現するには、次の手順に従います。

jQuery AJAX コード

HTML ファイルに jQuery ライブラリを組み込み、次の AJAX コードを記述します。

<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 コード

Records.php ファイルを作成し、MySQL データベースに接続し、クエリを実行してレコードを取得します。

$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;

問題の解決

提供されたコードが機能していない可能性があります以下の理由により、あなたの list.php には、ready 関数内にalert(response) ステートメントが含まれています。これにより、AJAX リクエストが完了する前に空のレスポンスが警告されます。

Records.php コードでは、非推奨の mysql_* 関数が使用されています。データベース接続には mysqli_* または PDO を使用する必要があります。
• 解決策

これらの問題を解決するには、コードを次のように変更します。

list.php

Records.php

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

これらの変更により、AJAXコードは MySQL データベースからレコードを正常に取得し、リロードせずに Web ページに表示する必要があります。

以上がjQuery AJAX を使用して MySQL データを取得し、リロードせずに Web ページに表示する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。