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

AJAX 可用來與數(shù)據(jù)庫進(jìn)行動態(tài)通信。

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

下面的例子將演示網(wǎng)頁如何通過 AJAX 從數(shù)據(jù)庫讀取信息：

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

實例

function?showCustomer(str)

{

var?xmlhttp;

if?(str=="")

{

document.getElementById("txtHint").innerHTML="";

return;

}

if?(window.XMLHttpRequest)

{

//?IE7+,?Firefox,?Chrome,?Opera,?Safari?瀏覽器執(zhí)行代碼

xmlhttp=new?XMLHttpRequest();

}

else

{

//?IE6,?IE5?瀏覽器執(zhí)行代碼

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();

}

運(yùn)行實例 ?

點擊 "運(yùn)行實例" 按鈕查看在線實例

效果圖：

實例解釋

showCustomer() 函數(shù)

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

var?xmlhttp;

if?(str=="")

{

document.getElementById("txtHint").innerHTML="";????return;??}

if?(window.XMLHttpRequest)

{

//?IE7+,?Firefox,?Chrome,?Opera,?Safari?瀏覽器執(zhí)行代碼

xmlhttp=new?XMLHttpRequest();??}

else

{

//?IE6,?IE5?瀏覽器執(zhí)行代碼

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() 函數(shù)執(zhí)行以下任務(wù)：

檢查是否已選擇某個客戶創(chuàng)建 XMLHttpRequest 對象當(dāng)服務(wù)器響應(yīng)就緒時執(zhí)行所創(chuàng)建的函數(shù)把請求發(fā)送到服務(wù)器上的文件請注意我們向 URL 添加了一個參數(shù) q (帶有輸入域中的內(nèi)容)

AJAX 服務(wù)器頁面

由上面的 JavaScript 調(diào)用的服務(wù)器頁面是 PHP 文件，名為 "getcustomer.php"。

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

"getcustomer.php" 中的源代碼負(fù)責(zé)對數(shù)據(jù)庫進(jìn)行查詢，然后用 HTML 表格返回結(jié)果：

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("

")

%>

總結(jié)

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

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。