December 19, 2011

【AJAX】AJAX+PHP簡單的範例 (用GET傳送)

A.html
<script type="text/javascript" src="ajax.js">
</script>
<script type="text/javascript" language="javascript">
function test()
{
 var aj=ajax();
宣告一個XMLHttpRequest物件
 if(aj==null)
如果瀏覽器不支援AJAX時可以在此處理
 {
  alert("ERROR");
 }
 var ul="ajax.php";
要傳送的網址,用一個變數存起來,等一下會用到
 aj.open("GET",ul,true);
參數說明
第一個用 POST 方式傳送
第二個要傳送的網址
第三個是否為非同步
 aj.onreadystatechange=b;
當資料回傳時,要處理的自訂函數,也可以直接將函數寫在這裡,方式請參POST篇
 aj.send(null);
用GET方式傳送,這裡輸入null
}
function b()
{
 if(aj.readyState==4)
readyStae式接收伺服器處理資料的狀態,說明如下
0 (還沒開始) 
1(讀取中)    
2 (已讀取)
 
      
3 (資訊交換中)
 
        
4 (請求完成)

 {
  var dd=aj.responseText;
responseText是伺服器傳送到用戶端的資料,型態是字串
還有另外一種是 responseXML 型態是
XMLDocuemnt物件,這邊用responeText示範
  var a1=document.getElementById("a1");
  if(a1.childNodes)
  {
   for(var i=0;i<a1.childNodes.length;i++)
   {
    a1.removeChild(a1.childNodes.item(i)); 
   }   
  }
  var add=document.createTextNode(dd);
  a1.appendChild(add);
 }
 else
 {
  if(a1.childNodes)
  {
   for(var i=0;i<a1.childNodes.length;i++)
   {
    a1.removeChild(a1.childNodes.item(i)); 
   }
  }
  var inin=document.createElement("img");
  inin.src="00.gif";
  a1.appendChild(inin);
 }
}
</script>
</head>

<body>
<input type="button" name="aa" value="OK" onclick="test()" />
<div id="a1"></div>
</body>

AJAX.JS

function ajax(){
var request = null;
try {
//IE7,or non-IE browser
request = new XMLHttpRequest();
} catch (trymicrosoft) {
try {
//IE browser
request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (othermicrosoft) {
try {
//other IE browser
request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (failed) {
//not support
request = null;
}
}
}
return request;
}

B.php

$num = 1000 + rand(0,1000);
echo $num;
?>

0推薦此文章
Today's Visitors: 0 Total Visitors: 56
Personal Category: 網頁Java Script Topic: feeling / personal / murmur
Previous in This Category: 【HTML】崁入網頁   Next in This Category: 【CSS】用DIV做出捲軸
[Trackback URL]

No one can comment

誰來收藏
Loading ...
unlog_NVPO 0