上一篇：AJAX PHP 下一篇：AJAX XML

AJAX 數(shù)據(jù)庫(kù)

AJAX 可用來(lái)與數(shù)據(jù)庫(kù)進(jìn)行交互式通信。

AJAX 數(shù)據(jù)庫(kù)實(shí)例

下面的實(shí)例將演示網(wǎng)頁(yè)如何通過(guò) AJAX 從數(shù)據(jù)庫(kù)讀取信息：

本教程使用到的 Websites 表 SQL 文件：websites.sql。

實(shí)例

選擇對(duì)應(yīng)選項(xiàng)，用戶信息會(huì)顯示在這……

實(shí)例解釋 - MySQL 數(shù)據(jù)庫(kù)

在上面的實(shí)例中，我們使用的數(shù)據(jù)庫(kù)表如下所示：

mysql> select * from websites;
+----+--------------+---------------------------+-------+---------+
| id | name         | url                       | alexa | country |
+----+--------------+---------------------------+-------+---------+
| 1  | Google       | https://www.google.cm/    | 1     | USA     |
| 2  | 淘寶       | https://www.taobao.com/   | 13    | CN      |
| 3  | 小白教程 | /    | 4689  | CN      |
| 4  | 微博       | http://weibo.com/         | 20    | CN      |
| 5  | Facebook     | https://www.facebook.com/ | 3     | USA     |
+----+--------------+---------------------------+-------+---------+
5 rows in set (0.01 sec)

實(shí)例解釋 - HTML 頁(yè)面

當(dāng)用戶在上面的下拉列表中選擇某位用戶時(shí)，會(huì)執(zhí)行名為 "showSite()" 的函數(shù)。該函數(shù)由 "onchange" 事件觸發(fā)：

test.html 文件代碼:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小白教程(json.cn)</title> <script>

</script> </head> <body> <form> <select name="users" onchange="showSite(this.value)"> <option value="">選擇一個(gè)網(wǎng)站:</option> <option value="1">Google</option> <option value="2">淘寶</option> <option value="3">小白教程</option> <option value="4">微博</option> <option value="5">Facebook</option> </select> </form> <br> <div id="txtHint"><b>網(wǎng)站信息顯示在這里……</b></div> </body> </html>

showSite() 函數(shù)會(huì)執(zhí)行以下步驟：

檢查是否有網(wǎng)站被選擇
創(chuàng)建 XMLHttpRequest 對(duì)象
創(chuàng)建在服務(wù)器響應(yīng)就緒時(shí)執(zhí)行的函數(shù)
向服務(wù)器上的文件發(fā)送請(qǐng)求
請(qǐng)注意添加到 URL 末端的參數(shù)（q）（包含下拉列表的內(nèi)容）

PHP 文件

上面這段通過(guò) JavaScript 調(diào)用的服務(wù)器頁(yè)面是名為 "getsite_mysql.php" 的 PHP 文件。

"getsite_mysql.php" 中的源代碼會(huì)運(yùn)行一次針對(duì) MySQL 數(shù)據(jù)庫(kù)的查詢，然后在 HTML 表格中返回結(jié)果：

getsite_mysql.php 文件代碼:

<?php $q = isset($_GET["q"]) ? intval($_GET["q"]) : ''; if(empty($q)) { echo '請(qǐng)選擇一個(gè)網(wǎng)站'; exit; } $con = mysqli_connect('localhost','root','123456'); if (!$con) { die('Could not connect: ' . mysqli_error($con)); } // 選擇數(shù)據(jù)庫(kù) mysqli_select_db($con,"test"); // 設(shè)置編碼，防止中文亂碼 mysqli_set_charset($con, "utf8"); $sql="SELECT * FROM Websites WHERE id = '".$q."'"; $result = mysqli_query($con,$sql); echo "<table border='1'> <tr> <th>ID</th> <th>網(wǎng)站名</th> <th>網(wǎng)站 URL</th> <th>Alexa 排名</th> <th>國(guó)家</th> </tr>"; while($row = mysqli_fetch_array($result)) { echo "<tr>"; echo "<td>" . $row['id'] . "</td>"; echo "<td>" . $row['name'] . "</td>"; echo "<td>" . $row['url'] . "</td>"; echo "<td>" . $row['alexa'] . "</td>"; echo "<td>" . $row['country'] . "</td>"; echo "</tr>"; } echo "</table>"; mysqli_close($con); ?>

解釋：當(dāng)查詢從 JavaScript 發(fā)送到 PHP 文件時(shí)，將發(fā)生：

PHP 打開(kāi)一個(gè)到 MySQL 數(shù)據(jù)庫(kù)的連接
找到選中的用戶
創(chuàng)建 HTML 表格，填充數(shù)據(jù)，并發(fā)送回 "txtHint" 占位符

上一篇：AJAX PHP 下一篇：AJAX XML

中文字幕一区二区人妻电影,亚洲av无码一区二区乱子伦as ,亚洲精品无码永久在线观看,亚洲成aⅴ人片久青草影院按摩,亚洲黑人巨大videos