×î¼òµ¥µÄAjaxÈëÃÅÀý³Ì
<?php
if(isset($_GET['do']) && $_GET['do']==='ajax')
{
exit("{msg:'Hello World!'}");
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ajax Demo</title>
<script type="text/javascript">
function readyStateChangeHandle(xhr)
{
// ¾ßÌå²Ù×÷,ÐèÒªÁ˽âÒ»ÏÂJavaScriptµÄÏà¹ØÖªÊ¶
eval('var result='+xhr.responseText);
window.alert(result.msg);
}
function Ajax()
{
// ´´½¨Òì²½ÇëÇó¶ÔÏó
var xhr=window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
// ÅжÏһ϶ÔÏóÊÇ·ñ´´½¨³É¹¦
if(!xhr)
{
return false;
}
// ÉèÖÃÒì²½ÇëÇó´¦Àíº¯Êý(ÕâÀïÓÃÄäÃûº¯Êý¶ø²»Ö±½ÓÓö¨ÒåºÃµÄº¯Êý,Ö÷ÒªÊÇ·½±ã´«µÝ²ÎÊý)
xhr.onreadystatechange=function(){
// readyStateÓÐ4ÖÖ״̬(0=UNINITIALIZED,1=LOADING,2=LOADED,3=INTERACTIVE,4=COMPLETED)
if(xhr.readyState==4)
{
// statusʵ¼ÊÉϾÍÊÇHTTP״̬Âë
if(xhr.status==200)
{
readyStateChangeHandle(xhr);
}
}
};
xhr.open("GET","ajax.php?do=ajax",true);
xhr.send(null);
}
</script>
</head>
<body>
<button type="button" onclick="Ajax();">Ajax</button>
</body>
</html>
Ïà¹ØÎĵµ£º
ÓйØajaxµÄÆäʵ¾ÍÊÇ1¸öÀàµÄʹÓÃ:XMLHttpRequest.
Ê×ÏÈÒªÉùÃ÷Õâ¸öÀàµÄ¶ÔÏ󣬼øÓÚ¸÷¸öä¯ÀÀÆ÷°ÑÕâ¸öÀàǶÈëµÄ·½Ê½²»Í¬£¬ÉùÃ÷µÄ·½Ê½Ò²²»Í¬£º
var xmlHttpReq = null;
if (window.XMLHttpRequest) //Mozilla ä¯ÀÀÆ÷
{
¡¡¡¡¡¡ xmlHttpReq = new XMLHttpRequest();
¡¡¡¡}
¡¡ else if (window.ActiveXObject) // ......
×î½ü×öÍøÕ¾Óõ½ÁËUpProgress¿Ø¼þ£¬ËùÒÔ°ÑÓöµ½µÄÎÊÌâºÍ×Ô¼ºµÄ¿´·¨Ð´ÏÂÀ´£¬¹©ÒÔºó²Î¿¼£¬Ò²Ï£Íû¸ø´ó¼Ò´úÂë°ïÖú¡£
UpProgressÊǺÍUpdatePanelÒ»ÆðʹÓõġ£ÊµÏÖЧ¹û¾ÍÊÇÔÚÌá½»µ½·þÎñÆ÷µÄʱºò£¬ÏÔʾÌáʾ£¬±ÈÈ磺“Êý¾Ý¼ÓÔØÖУ¬ÇëÉÔ΢..”¸ø ......
Ò»¡¢´¦ÀíajaxÇëÇóµÄjspÎļþ£ºauto.jsp
<%@ page contentType="text/html; charset=gb2312" %>
<%
//ÉèÖÃÊä³öÐÅÏ¢µÄ¸ñʽ¼°×Ö·û¼¯
response.setContentType("text/xml; charset=UTF-8");
response.setHeader("Cache-Control","no-cache&q ......
Ajax£¬Òì²½JavaScriptÓëXML£¬ÊÇʹÓÿͻ§¶Ë½Å±¾ÓëWeb·þÎñÆ÷½»»»Êý¾ÝµÄWebÓ¦Óÿª·¢·½·¨¡£ÕâÑù£¬WebÒ³Ãæ²»Óôò¶Ï½»»¥Á÷³Ì½øÐÐÖØÐ¼Ӳ㬾ͿÉÒÔ¶¯Ì¬µØ¸üС£Ê¹ÓÃAjax£¬Äã¿ÉÒÔ´´½¨½Ó½ü±¾µØ×ÀÃæÓ¦Óõģ¬Ö±½ÓµÄ¡¢¸ß¿ÉÓõġ¢¸ü·á¸»µÄ¡¢¸ü¶¯Ì¬µÄWebÓû§½Ó¿Ú½çÃæ¡£
Ajax´¦Àí¹ý³Ì
Ò»¸öAjax½»»¥´ÓÒ»¸ö³ÆÎªXMLHttpRequestµÄJavaScript ......
ÕâÀï²»ÊÇÖ¸µ÷Óüòµ¥µÄ PageMethod£¬ÒòΪ¾²Ì¬·½·¨ÊDz»ÄܲÙ×÷µ±Ç°Ò³ÃæµÄ¿Ø¼þµÄ£¬ËùÒÔ¾²Ì¬µÄ PageMethod ×÷Óþ͸úÆÕͨµÄ WebService Ò»Ñù£¬±È½Ï¾ÖÏÞ¡£
ÄÇô£¬µ÷ÓÃÒ»°ãµÄ·þÎñÆ÷¶Ë·½·¨£¬Æäʵ¾ÍÊÇ·¢ÆðÒ»¸öÒì²½»Øµ÷¡£×î¼òµ¥µÄʵÏÖ°ì·¨£¬ÊÇͨ¹ý UpdatePanel À´×ö¡£
Ê×Ïȶ¨ÒåÒ»¸öÒþ²ØµÄ LinkButton£¬ÔÚÆä´¦ÀíʼþÖУ¬È¥µ÷ÓÃÎÒÃÇÒªÖ ......