標籤：php ajax xml js
在前面 的網頁開發的階段總結（三）中，我們知道JS與PHP之間直接互相調用，往往有很多不便，而且一次只能傳送一個資料結果進行返回。而通過ajax方法可以實現JS一次性讀取php的所傳送過來的大量資料。通過提交表單的方式，讓php可以一次性讀取JS的大量資料。
1、借用AJAX方法，通過php讀取資料庫將大量資料顯示在網頁用戶端上。
a、頁面一載入完，執行函數Gett()，代碼如下：
<html><head><meta http-equiv="Content-Type" content="text/html; charset="gb2312"><title></title><script language="JavaScript" src="javascript.js"></script><script language="JavaScript">function Gett(){ if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlHttp=new XMLHttpRequest(); var url="responsexml.php"; xmlHttp.open("GET",url,false); xmlHttp.send(null); xmlHttp.onreadystatechange=getValue(xmlHttp); }else { // code for IE6, IE5 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); var url="responsexml.php"; xmlHttp.onreadystatechange=function() {if (xmlHttp.readyState==4 && xmlHttp.status==200){ xmlDoc=xmlHttp.responseXML; nodes=xmlDoc.documentElement.childNodes;InputVoltage.innerHTML = nodes.item(3).text;OutputVoltage.innerHTML = nodes.item(7).text;OutputMinVoltage.innerHTML = nodes.item(34).text; OutputMaxVoltage.innerHTML = nodes.item(33).text;Frequency.innerHTML = nodes.item(13).text;xmlHttp = null;} } xmlHttp.open("GET",url,true); xmlHttp.send(null); } } </script></head><body onload="Gett()"><p> </p><div align="center"><br> <table width="75%" border="0" cellspacing="0"> <tr> <td width="25%" nowrap><br> <table width="75%" border="0" align="center" cellspacing="0"> <tr> <td width="50%" nowrap>InputVoltage</td> <td width="50%" height="22" nowrap> <span id='InputVoltage'></span> V </td> </tr> <tr> <td nowrap>Frequency</td> <td nowrap> <span id='Frequency'></span> Hz </td> </tr> </table></td> <td width="50%" nowrap><div align="center"></div></td> <td width="25%" nowrap> <table width="98%" height="100" border="0" cellspacing="0"> <tr> <td width="50%" nowrap>OutputVoltage</td> <td width="50%" height="22" nowrap> <span id='OutputVoltage'></span> V </td> </tr> <tr> <td nowrap>OutputMaxVoltage</td> <td height="22" nowrap> <span id='OutputMaxVoltage'></span> V </td> </tr> <tr> <td nowrap>OutputMinVoltage</td> <td height="22" nowrap> <span id='OutputMinVoltage'></span> V </td> </tr> </div></body></html>
<?php $dbh = new PDO("sqlite:upsdata.dat", null, null); $sth = $dbh->query('SELECT * FROM t_ups_rundata'); $result = $sth->fetchAll(); $i=0; $CountArray=0; foreach($result[0] as $x=>$x_value) { if($i%2==0) {$UPSData[$CountArray++]=$x_value;}$i++;}header('Content-Type: text/xml');echo "<?xml version='1.0' encoding='utf-8'?>";echo "<upsdataxml>"; echo"<protocol_id>$UPSData[0]</protocol_id>";echo "<curr_time>$UPSData[1]</curr_time>";echo "<input_phase>$UPSData[2]</input_phase>";echo "<inputvol_a>$UPSData[3]</inputvol_a>"; echo "<inputvol_b>$UPSData[4]</inputvol_b>"; echo "<inputvol_c>$UPSData[5]</inputvol_c>"; echo "<output_phase>$UPSData[6]</output_phase>";echo "<outputvol_a>$UPSData[7]</outputvol_a>"; echo "<outputvol_b>$UPSData[8]</outputvol_b>"; echo "<outputvol_c>$UPSData[9]</outputvol_c>"; echo "<output_load>$UPSData[10]</output_load>";echo "<batt_total_vol>$UPSData[11]</batt_total_vol>";echo"<batt_cap>$UPSData[12]</batt_cap>";echo"<input_fre>$UPSData[13]</input_fre>";echo"<ups_model>$UPSData[14]</ups_model>";echo"<ups_manufactory>$UPSData[15]</ups_manufactory>";echo"<ups_ver>$UPSData[16]</ups_ver>";echo"<rate_vol>$UPSData[17]</rate_vol>";echo"<rate_power>$UPSData[18]</rate_power>";echo"<rate_fre>$UPSData[19]</rate_fre>";echo"<rate_battvol>$UPSData[20]</rate_battvol>";echo"<is_acfail>$UPSData[21]</is_acfail>";echo"<is_bypass>$UPSData[22]</is_bypass>";echo"<is_battlow>$UPSData[23]</is_battlow>";echo"<is_upsfail>$UPSData[24]</is_upsfail>";echo"<is_shutdown>$UPSData[25]</is_shutdown>";echo"<is_testting>$UPSData[26]</is_testting>";echo"<is_ups_offline>$UPSData[27]</is_ups_offline>";echo"<e_temperature>$UPSData[28]</e_temperature>";echo "<e_humidity>$UPSData[29]</e_humidity>";echo"<input_default_vol>$UPSData[30]</input_default_vol>";echo"<batt_mon_vol>$UPSData[31]</batt_mon_vol>";echo"<ups_temp>$UPSData[32]</ups_temp>";echo"<output_max_vol>$UPSData[33]</output_max_vol>";echo"<output_min_vol>$UPSData[34]</output_min_vol>";echo"<batt_temp>$UPSData[35]</batt_temp>";echo"<is_horn>$UPSData[36]</is_horn>";echo"<is_ups_type>$UPSData[37]</is_ups_type>";echo"<is_guard>$UPSData[38]</is_guard>";echo "</upsdataxml>"; $dbh = null;?>
完整代碼下載：http://download.csdn.net/detail/aba13579/7877307
2、通過提交表單的方式，在php伺服器端的用$_GET()或$_POST()方式擷取大量的資料寫入資料庫。
a、通過 <input class="inputButtonNormal" type="submit" name="b1" value="SubMit">的type="submit"類型將資料上傳到PHP服務端上。
<html><head><meta http-equiv="Content-Type" content="text/html; charset="gb2312"><script language="JavaScript"></script></head><body> <form name="UPSCfg" target="id_iframe" method="post" action="UPSCfgForm.php"> <table width="80%" border="0" cellspacing="0" class="tableNormal" > <tr bgcolor="#0099FF"> </tr><tr> <td class="tableSingularLine" width="50%" nowrap>UpsCommBaud</td> <td class="tableSingularLine" width="50%" nowrap> <select name="UpsCommBaud" size="1" type="text"><option value="1200"<?php$b=2400;if ($b==1200)echo("selected");?>>1200</option><option value="2400"<?phpif (($b==2400)||($b==0))echo("selected");?>>2400</option><option value="4800"<?phpif ($b==4800)echo("selected");?>>4800</option><option value="9600"<?phpif ($b==9600)echo("selected");?>>9600</option><option value="14400"<?phpif ($b==14400)echo("selected");?>>14400</option><option value="19200"<?phpif ($b==19200)echo("selected");?>>19200</option><option value="38400"<?phpif ($b==38400)echo("selected");?>>38400</option></select> </td> </tr> <tr> <td class="tableSingularLine" nowrap>OfflineQueryTime</td> <td class="tableSingularLine" nowrap><input class="textEnaSty" name="OfflineQueryTime" type="text" value="1000" size="1"> </td></tr> <tr> <td class="tableSingularLine" nowrap>OfflineQueryNum</td> <td class="tableSingularLine" nowrap><input class="textEnaSty" name="OfflineQueryNum" type="text" value="1" size="5"></td> </tr> </table> <p> <input class="inputButtonNormal" type="submit" name="b1" value="SubMit"> <input class="inputButtonNormal" type="reset" name="Reset" value="Cacel"> </p> <iframe name="id_iframe" style="display:none;" src="about:blank"></iframe> </form></body><html>
b、PHP伺服器端通過$_POST()擷取資料寫入資料庫
<?php $temp = array(); $temp[0] = $_POST["UpsCommBaud"]; $temp[1] = $_POST["OfflineQueryTime"]; $temp[2] = $_POST["OfflineQueryNum"]; try{ $IPGuard ="sqlite:ipguard.dat";$dbh = new PDO($IPGuard, null, null); $dbh->exec("UPDATE t_ups_protocol set baudrate='$temp[0]'");$dbh->exec("UPDATE t_env_param set interval='$temp[1]',offLine_Count='$temp[2]'");$dbh->beginTransaction();$dbh = null;}catch (PDOException $e){ echo 'Connection failed: ' . $e->getMessage(); $dbh = null;} ?>
完整代碼下載：http://download.csdn.net/detail/aba13579/7877311
3、借用AJAX方式，一次性傳遞一個資料到php伺服器上並一次性將一個資料返回給web用戶端。
以下網址有詳細介紹：http://www.w3school.com.cn/ajax/ajax_asp_php.asp，故不再詳述。
網頁開發的階段總結（四）--JS與PHP之間大資料的傳送
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
