一区二区国产高清视频在线_真人性做爰A片免费_强伦人妻BD在线电影_亚洲熟妇无码AV_免费人成视频在线观看网站_亚洲欧美精品午睡沙发_在线观看无码的免费网站_中文字幕无码A片久久_日韩欧美国产一区精品_久久精品女人天堂av

重慶醫(yī)科大學(xué)論壇

標(biāo)題: 快速、簡便的使用AJAX技術(shù)操作的三部曲 [打印本頁]

作者: liwei58 時間: 2007-11-21 10:11
標(biāo)題: 快速、簡便的使用AJAX技術(shù)操作的三部曲
其實AJAX并不復(fù)雜，自從AJAX技術(shù)出來后，天花亂墜的框架紛紛出臺，搞得技術(shù)開發(fā)人員無從下手，baidu google里也有很多例子，大都是非常復(fù)雜。　　其實就web開發(fā)而言，AJAX技術(shù)只是一個配合，完全沒有必要本末倒置，是一種頁面優(yōu)化的技術(shù)，也就是說，如何去優(yōu)化我們的web頁面才是AJAX的重頭戲。下面我舉個很簡單的例子，可以滿足大部分的業(yè)務(wù)需求。（當(dāng)然，如果是很專業(yè)的頁面要求，可以去參考那些復(fù)雜的框架）
　　第一步：
　　寫一個后臺的“接口”，這個可以用任何語言來實現(xiàn)，只要能返回http報文就可以了，我這里以webwork后臺代碼舉個例子

public String hotWeek() throws Exception{ HttpServletResponse response = ServletActionContext.getResponse(); response.setContentType("text/xml; charset=gb2312"); PrintWriter out = response.getWriter(); StringBuffer insertHotHtml = new StringBuffer(); insertHotHtml.append(" "); insertHotHtml.append(""); insertHotHtml.append(""); insertHotHtml.append(""); insertHotHtml.append("

"); out.print(insertHotHtml.toString()); //返回一個有表格的HTTP報文 return null; }　　不用java的朋友根本不用管這些，只要記住，能返回一個HTTP報文，比如一個靜態(tài)網(wǎng)頁也可以。
　　第二步：
　　在頁面里加入下面這段javascript代碼

var xmlHttp;function createXMLHttpRequest(){ if (window.ActiveXObject){ xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest){ xmlHttp = new XMLHttpRequest(); }}function startAjaxRequest(method,async,actionUrl,data, invokeMethod){ createXMLHttpRequest(); xmlHttp.open(method, actionUrl, async); xmlHttp.onreadystatechange = handleStateChange; xmlHttp.send(data); function handleStateChange(){ if(xmlHttp.readyState == 4){ if(xmlHttp.status == 200){ var nodeId = xmlHttp.responseText; if (nodeId=='noPermission'){ alert('你沒有權(quán)限訪問此操作!'); }else if( (falseIndex = nodeId.indexOf("false||"))!= -1 ){ alert('操作失敗，可能的原因為:' + nodeId.substring(falseIndex+7, nodeId.length) + "!"); }else if(nodeId=='false'){ alert('操作失敗，請和管理員聯(lián)系！'); }else ...{ if (invokeMethod == undefined){ getResult(nodeId); } else { invokeMethod(nodeId); } } } } }}

　　我們要用的就是startAjaxRequest（method，async，actionUrl，data， invokeMethod）這個方法，具體實現(xiàn)，也不可以不用理會，對于IE和firefox都可以兼容，method 要么是GET，要么是POST，async我們一般都設(shè)置為true就可以了，data用來傳數(shù)據(jù)給后臺，invokeMethod是指后臺返回數(shù)據(jù)后，前臺自動調(diào)用什么方法，如果為空，那么就默認(rèn)調(diào)用 invokeMethod（nodeId）這個方法。

$(document).ready(function(){ var acti; $('body').html("頁面加載中..."); startAjaxRequest("GET",true,actionUrl,''); });

　　這里我是用jQuery的，一個很好用的javascript框架。
　　"./provider！hotWeek.action" 就是我們獲取HTTP報文的地址，大家完全可以用比如 myTable.asp myTable.php只要返回的HTTP報文是符合XML規(guī)則的HTML語言就可以了。
　　第三步：
　　后臺返回后的處理方法

function getResult(nodeId){ $('body').html(nodeId); }

　　總結(jié)起來，其實只要 startAjaxRequest（"GET"，true，actionUrl，''）這么一個方法就可以去滿足大部分AJAX的業(yè)務(wù)需求了，根本沒有必要弄得那么復(fù)雜。
來原：www

歡迎光臨重慶醫(yī)科大學(xué)論壇 (http://www.espacio12.com/)