首頁 >後端開發 >php教程 >關於PHP - AJAX 與 MySQL之間的交互

關於PHP - AJAX 與 MySQL之間的交互

jacklove原創: 2018-05-07 14:56:421900瀏覽

AJAX 可用於與資料庫進行互動式通信，對於php來說很重要，本品阿將對其解說。

AJAX 資料庫實例

下面的實例將示範網頁如何透過 AJAX 從資料庫讀取資訊：

本教學所使用的 Websites 表 SQL 檔案：websites.sql。

實例

選擇網站: Google 淘寶菜鳥教學微博 Facebook

選擇對應選項，使用者資訊會顯示在這…

#實例解釋- MySQL 資料庫

#在上面的實例中，我們使用的資料庫表如下所示：

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  | 菜鸟教程 | http://www.runoob.com/    | 4689  | CN      || 4  | 微博       | http://weibo.com/         | 20    | CN      || 5  | Facebook     | https://www.facebook.com/ | 3     | USA     |+----+--------------+---------------------------+-------+---------+5 rows in set (0.01 sec)

實例解釋- HTML 頁面

當使用者在上面的下拉清單中選擇某位使用者時，會執行名為"showSite()" 的函數。函數由"onchange" 事件觸發：

test.html 檔案程式碼:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> <script>
function showSite(str){
    if (str=="")
    {
        document.getElementById("txtHint").innerHTML="";        return;    } 
    if (window.XMLHttpRequest)
    {
        // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xmlhttp=new XMLHttpRequest();    }
    else
    {
        // IE6, IE5 浏览器执行代码
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;        }
    }
    xmlhttp.open("GET","getsite_mysql.php?q="+str,true);    xmlhttp.send();}
</script></head><body>
 <form><select name="users" onchange="showSite(this.value)"><option value="">选择一个网站:</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>网站信息显示在这里……</b></div>
 </body></html>

showSite() 函數會執行下列步驟：

檢查是否有網站被選取

建立XMLHttpRequest 物件

建立在伺服器回應就緒時執行的函數

向伺服器上的檔案傳送請求

請注意新增至URL 末端的參數（q）（包含下拉清單的內容）

PHP 檔案

上面這段透過JavaScript 呼叫的伺服器頁面是名為"getsite_mysql.php" 的PHP 檔案。

"getsite_mysql.php" 中的原始程式碼會執行一次針對MySQL 資料庫的查詢，然後在HTML 表格中傳回結果：

getsite_mysql.php 檔案碼:

<?php$q = isset($_GET["q"]) ? intval($_GET["q"]) : &#39;&#39;; 
if(empty($q)) {
    echo &#39;请选择一个网站&#39;;    exit;}
 $con = mysqli_connect(&#39;localhost&#39;,&#39;root&#39;,&#39;123456&#39;);if (!$con){
    die(&#39;Could not connect: &#39; . mysqli_error($con));}// 选择数据库mysqli_select_db($con,"test");// 设置编码，防止中文乱码mysqli_set_charset($con, "utf8"); 
$sql="SELECT * FROM Websites WHERE id = &#39;".$q."&#39;"; 
$result = mysqli_query($con,$sql); 
echo "<table border=&#39;1&#39;>
<tr>
<th>ID</th>
<th>网站名</th>
<th>网站 URL</th>
<th>Alexa 排名</th>
<th>国家</th>
</tr>"; 
while($row = mysqli_fetch_array($result)){
    echo "<tr>";    echo "<td>" . $row[&#39;id&#39;] . "</td>";    echo "<td>" . $row[&#39;name&#39;] . "</td>";    echo "<td>" . $row[&#39;url&#39;] . "</td>";    echo "<td>" . $row[&#39;alexa&#39;] . "</td>";    echo "<td>" . $row[&#39;country&#39;] . "</td>";    echo "</tr>";}echo "</table>"; 
mysqli_close($con);?>

解釋：當查詢從JavaScript 傳送到PHP 檔案時，將會發生：

PHP 開啟一個到MySQL 資料庫的連線

找到選取的使用者

建立HTML 表格，填入數據，並發回"txtHint" 佔位符

本篇對PHP - AJAX 與MySQL之間的交互做了詳細的講解，更多的學習資料清關注php中文網即可觀看。

關於PHP - AJAX 與 MySQL之間的交互

相關文章