AJAX 數據庫實例

AJAX 可用來與數據庫進行動態通信。

AJAX 數據庫實例

下面的例子將演示網頁如何通過 AJAX 從數據庫讀取信息：

請在下面的下拉列表中選擇一個客戶：

實例

function?showCustomer(str)

{

var?xmlhttp;

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","getcustomer.php?q="+str,true);

xmlhttp.send();

}

運行實例 ?

點擊 "運行實例" 按鈕查看在線實例

效果圖：

實例解釋

showCustomer() 函數

當用戶在上面的下拉列表中選擇某個客戶時，會執行名為 "showCustomer()" 的函數。該函數由 "onchange" 事件觸發：function?showCustomer(str){

var?xmlhttp;

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","getcustomer.php?q="+str,true);??xmlhttp.send();}

showCustomer() 函數執行以下任務：

檢查是否已選擇某個客戶創建 XMLHttpRequest 對象當服務器響應就緒時執行所創建的函數把請求發送到服務器上的文件請注意我們向 URL 添加了一個參數 q (帶有輸入域中的內容)

AJAX 服務器頁面

由上面的 JavaScript 調用的服務器頁面是 PHP 文件，名為 "getcustomer.php"。

用 PHP 編寫服務器文件也很容易，或者用其他服務器語言。

"getcustomer.php" 中的源代碼負責對數據庫進行查詢，然后用 HTML 表格返回結果：

response.expires=-1

sql="SELECT?*?FROM?CUSTOMERS?WHERE?CUSTOMERID="

sql=sql?&?"'"?&?request.querystring("q")?&?"'"

set?conn=Server.CreateObject("ADODB.Connection")

conn.Provider="Microsoft.Jet.OLEDB.4.0"

conn.Open(Server.Mappath("/db/northwind.mdb"))

set?rs=Server.CreateObject("ADODB.recordset")

rs.Open?sql,conn

response.write("

do?until?rs.EOF

for?each?x?in?rs.Fields

response.write("

"?&?x.name?&?"")

response.write("

"?&?x.value?&?"")

next

rs.MoveNext

loop

response.write("

")

%>

總結

以上是生活随笔為你收集整理的ajax的数据库,AJAX 数据库的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。