PHP和AJAXresponseXML實(shí)例-6.6PHP和AJAX

AJAX 可用于以 XML 返回?cái)?shù)據(jù)庫(kù)信息。

創(chuàng)新互聯(lián)建站從2013年創(chuàng)立,是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司,擁有項(xiàng)目網(wǎng)站設(shè)計(jì)、成都網(wǎng)站設(shè)計(jì)網(wǎng)站策劃,項(xiàng)目實(shí)施與項(xiàng)目整合能力。我們以讓每一個(gè)夢(mèng)想脫穎而出為使命,1280元恩施土家做網(wǎng)站,已為上家服務(wù),為恩施土家各地企業(yè)和個(gè)人服務(wù),聯(lián)系電話:028-86922220

AJAX Database 轉(zhuǎn) XML 實(shí)例 (測(cè)試說(shuō)明:該實(shí)例功能未實(shí)現(xiàn))

在下面的 AJAX 實(shí)例中,我們將演示網(wǎng)頁(yè)如何從 MySQL 數(shù)據(jù)庫(kù)中讀取信息,把數(shù)據(jù)轉(zhuǎn)換為 XML 文檔,并在不同的地方使用這個(gè)文檔來(lái)顯示信息。

本例與上一節(jié)中的 "PHP AJAX Database" 這個(gè)例子很相似,不過(guò)有一個(gè)很大的不同:在本例中,我們通過(guò)使用 responseXML 函數(shù)從 PHP 頁(yè)面得到的是 XML 形式的數(shù)據(jù)。

把 XML 文檔作為響應(yīng)來(lái)接收,使我們有能力更新頁(yè)面的多個(gè)位置,而不僅僅是接收一個(gè) PHP 輸出并顯示出來(lái)。

在本例中,我們將使用從數(shù)據(jù)庫(kù)接收到的信息來(lái)更新多個(gè) <span> 元素。

在下拉列表中選擇一個(gè)名字 Select a User:  Peter Griffin Lois Griffin Joseph Swanson Glenn Quagmire   

此列由四個(gè)元素組成:

MySQL 數(shù)據(jù)庫(kù)簡(jiǎn)單的 HTML 表單JavaScriptPHP 頁(yè)面
數(shù)據(jù)庫(kù)

將在本例中使用的數(shù)據(jù)庫(kù)看起來(lái)類似這樣:

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 表單

上面的例子包含了一個(gè)簡(jiǎn)單的 HTML 表單,以及指向 JavaScript 的鏈接:

<html><head><script src="responsexml.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><h2><span id="firstname"></span>&nbsp;<span id="lastname"></span></h2><span id="job"></span><div style="text-align: right"><span id="age_text"></span><span id="age"></span><span id="hometown_text"></span><span id="hometown"></span></div></body></html> 例子解釋 - HTML 表單 HTML 表單是一個(gè)下拉列表,其 name 屬性的值是 "users",可選項(xiàng)的值與數(shù)據(jù)庫(kù)的 id 字段相對(duì)應(yīng)表單下面有幾個(gè) <span> 元素,它們用作我們所接收到的不同的值的占位符當(dāng)用戶選擇了具體的選項(xiàng),函數(shù) "showUser()" 就會(huì)執(zhí)行。該函數(shù)的執(zhí)行由 "onchange" 事件觸發(fā)

換句話說(shuō),每當(dāng)用戶在下拉列表中改變了值,函數(shù) showUser() 就會(huì)執(zhí)行,并在指定的 <span> 元素中輸出結(jié)果。

JavaScript

這是存儲(chǔ)在文件 "responsexml.js" 中的 JavaScript 代碼:

var xmlHttpfunction showUser(str) { xmlHttp=GetXmlHttpObject() if (xmlHttp==null) { alert ("Browser does not support HTTP Request") return } var url="responsexml.php" url=url+"?q="+str url=url+"&sid="+Math.random() xmlHttp.onreadystatechange=stateChanged xmlHttp.open("GET",url,true) xmlHttp.send(null) }function stateChanged() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ xmlDoc=xmlHttp.responseXML; document.getElementById("firstname").innerHTML= xmlDoc.getElementsByTagName("firstname")[0].childNodes[0].nodeValue; document.getElementById("lastname").innerHTML= xmlDoc.getElementsByTagName("lastname")[0].childNodes[0].nodeValue; document.getElementById("job").innerHTML= xmlDoc.getElementsByTagName("job")[0].childNodes[0].nodeValue; document.getElementById("age_text").innerHTML="Age: "; document.getElementById("age").innerHTML= xmlDoc.getElementsByTagName("age")[0].childNodes[0].nodeValue; document.getElementById("hometown_text").innerHTML="<br/>From: "; document.getElementById("hometown").innerHTML= xmlDoc.getElementsByTagName("hometown")[0].childNodes[0].nodeValue; }}function GetXmlHttpObject() { var objXMLHttp=null if (window.XMLHttpRequest) { objXMLHttp=new XMLHttpRequest() } else if (window.ActiveXObject) { objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP") } return objXMLHttp } 例子解釋:

showUser() 與 GetXmlHttpObject 函數(shù)與 PHP 和 AJAX MySQL 數(shù)據(jù)庫(kù)實(shí)例這一節(jié)中的例子是相同的。您可以參閱其中的相關(guān)解釋。

stateChanged() 函數(shù)

如果選擇了下拉列表中的項(xiàng)目,該函數(shù)執(zhí)行:

通過(guò)使用 responseXML 函數(shù),把 "xmlDoc" 變量定義為一個(gè) XML 文檔從這個(gè) XML 文檔中取回?cái)?shù)據(jù),把它們放在正確的 "span" 元素中
PHP 頁(yè)面

這個(gè)由 JavaScript 調(diào)用的服務(wù)器頁(yè)面,是一個(gè)名為 "responsexml.php" 的簡(jiǎn)單的 PHP 文件。

該頁(yè)面由 PHP 編寫(xiě),并使用 MySQL 數(shù)據(jù)庫(kù)。

代碼會(huì)運(yùn)行一段針對(duì)數(shù)據(jù)庫(kù)的 SQL 查詢,并以 XML 文檔返回結(jié)果:

<?phpheader('Content-Type: text/xml');header("Cache-Control: no-cache, must-revalidate");//A date in the pastheader("Expires: Mon, 26 Jul 1997 05:00:00 GMT");$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 '<?xml version="1.0" encoding="ISO-8859-1"?><person>';while($row = mysql_fetch_array($result)) { echo "<firstname>" . $row['FirstName'] . "</firstname>"; echo "<lastname>" . $row['LastName'] . "</lastname>"; echo "<age>" . $row['Age'] . "</age>"; echo "<hometown>" . $row['Hometown'] . "</hometown>"; echo "<job>" . $row['Job'] . "</job>"; }echo "</person>";mysql_close($con);?> 例子解釋:

當(dāng)查詢從 JavaScript 送達(dá) PHP 頁(yè)面時(shí),會(huì)發(fā)生:

PHP 文檔的 content-type 被設(shè)置為 "text/xml"PHP 文檔被設(shè)置為 "no-cache",以防止緩存用 HTML 頁(yè)面送來(lái)的數(shù)據(jù)設(shè)置 $q 變量PHP 打開(kāi)與 MySQL 服務(wù)器的連接找到帶有指定 id 的 "user"以 XML 文檔輸出數(shù)據(jù)

文章標(biāo)題:PHP和AJAXresponseXML實(shí)例-6.6PHP和AJAX
網(wǎng)站地址:http://www.muchs.cn/article34/dghhose.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供移動(dòng)網(wǎng)站建設(shè)、用戶體驗(yàn)、商城網(wǎng)站、軟件開(kāi)發(fā)、網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

成都網(wǎng)站建設(shè)公司