PHP 和 AJAX MySQL 資料庫執行個體

最後更新：2018-12-07 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

文章目錄

例子解釋 - HTML 表單
例子解釋：
例子解釋：

AJAX 可用來與資料庫進行互動式通訊。

AJAX 資料庫執行個體

在下面的 AJAX 執行個體中，我們將示範網頁如何使用 AJAX 技術從 MySQL 資料庫中讀取資訊。

在下拉式清單中選擇一個名字（測試說明：該執行個體功能未實現）

在此列出使用者資訊。

此列由四個元素組成：

MySQL 資料庫
簡單的 HTML 表單
JavaScript
PHP 頁面

資料庫

將在本例中使用的資料庫看起來類似這樣：

id	FirstName	LastName	Age	Hometown	Job
1	Peter	Griffin	41	Quahog	Brewery
2	Lois	Griffin	40	Newport	Piano Teacher
3	Joseph	Swanson	39	Quahog	Police Officer
4	Glenn	Quagmire	41	Quahog	Pilot

HTML 表單

上面的例子包含了一個簡單的 HTML 表單，以及指向 JavaScript 的連結：

<html><head><script src="selectuser.js"></script></head><body><form> Select a User:<select name="users" onchange="showUser(this.value)"><option value="1">Peter Griffin</option><option value="2">Lois Griffin</option><option value="3">Glenn Quagmire</option><option value="4">Joseph Swanson</option></select></form><p><div id="txtHint"><b>User info will be listed here.</b></div></p></body></html>

例子解釋 - HTML 表單

正如您看到的，它僅僅是一個簡單的 HTML 表單，其中帶有名為 "users" 的下拉式清單，這個列表包含了姓名，以及與資料庫的 "id" 對應的選項值。

表單下面的段落包含了名為 "txtHint" 的 div。這個 div 用作從網頁伺服器檢索到的資訊的預留位置。

當使用者選擇資料時，執行名為 "showUser()" 的函數。該函數的執行由 "onchange" 事件觸發。

換句話說：每當使用者改變下拉式清單中的值，就會調用 showUser() 函數。

JavaScript

這是儲存在 "selectuser.js" 檔案中的 JavaScript 代碼：

var xmlHttpfunction showUser(str){ xmlHttp=GetXmlHttpObject()if (xmlHttp==null) { alert ("Browser does not support HTTP Request") return }var url="getuser.php"url=url+"?q="+strurl=url+"&sid="+Math.random()xmlHttp.onreadystatechange=stateChanged xmlHttp.open("GET",url,true)xmlHttp.send(null)}function stateChanged() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {  document.getElementById("txtHint").innerHTML=xmlHttp.responseText  } }function GetXmlHttpObject(){var xmlHttp=null;try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); }catch (e) { //Internet Explorer try  {  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");  } catch (e)  {  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");  } }return xmlHttp;}

例子解釋：

stateChanged() 和 GetXmlHttpObject 函數與 PHP AJAX 請求那一節中的相同，您可以參閱其中的相關解釋。

showUser() 函數

假如下拉式清單中的項目被選擇，函數執行：

調用 GetXmlHttpObject 函數來建立 XMLHTTP 對象
定義發送到伺服器的 URL（檔案名稱）
向 URL 添加帶有下拉式清單內容的參數 (q)
添加一個隨機數，以防伺服器使用緩衝的檔案
當觸發事件時調用 stateChanged
通過給定的 URL 開啟 XMLHTTP 對象
向伺服器發送 HTTP 要求

PHP 頁面

由 JavaScript 調用的伺服器頁面，是名為 "getuser.php" 的簡單 PHP 檔案。

該頁面用 PHP 編寫，並使用 MySQL 資料庫。

其中的代碼執行針對資料庫的 SQL 查詢，並以 HTML 表格返回結果：

<?php$q=$_GET["q"];$con = mysql_connect('localhost', 'peter', 'abc123');if (!$con) { die('Could not connect: ' . mysql_error()); }mysql_select_db("ajax_demo", $con);$sql="SELECT * FROM user WHERE id = '".$q."'";$result = mysql_query($sql);echo "<table border='1'><tr><th>Firstname</th><th>Lastname</th><th>Age</th><th>Hometown</th><th>Job</th></tr>";while($row = mysql_fetch_array($result)) { echo "<tr>"; echo "<td>" . $row['FirstName'] . "</td>"; echo "<td>" . $row['LastName'] . "</td>"; echo "<td>" . $row['Age'] . "</td>"; echo "<td>" . $row['Hometown'] . "</td>"; echo "<td>" . $row['Job'] . "</td>"; echo "</tr>"; }echo "</table>";mysql_close($con);?>

例子解釋：

當查詢從 JavaScript 被發送到這個 PHP 頁面，會發生：

PHP 開啟到達 MySQL 伺服器的串連
找到擁有指定姓名的 "user"
建立表格，插入資料，然後將其發送到 "txtHint" 預留位置

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More