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

jacklove
發布: 2023-03-25 14:36:01
原創
1864 人瀏覽過

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之間的交互做了詳細的講解,更多的學習資料清關注p​​hp中文網即可觀看。

相關推薦:

關於PHP - AJAX 與PHP之間的聯繫

關於PHP Simple XML的相關知識

關於PHP XML DOM的相關知識點

#

以上是關於PHP - AJAX 與 MySQL之間的交互的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板