實現區域性重新整理的三種方法
1、 AJAX主要應用到的是區域性重新整理。也就是當頁面上的摸一個標籤內容需要重新整理,為了不引起整個頁面的回發,通常利用AJAX來解決。
2、獲取其他網頁的內容。當本頁內容基於其他網站時(例如天氣預報),通常也使用AJAX+正則表示式的方法,從外網截獲自己需要的內容。
3、需要非同步讀取的地方。這個最明顯的例子,非Google map莫屬了,因為地圖佔據的資料資源太大,當用戶移動的時候,使用非同步讀取方式可以縮短資料抓取時間,同時AJAX技術對於影像網站非同步讀取資料也有很大的幫助的
4、最新的桌面應用模式。這中桌面應用模式可能算是AJAX擴大應用的一種,在以前的程式中,CS是桌面,BS是web,而使用AJAx可以將網路上的東西,顯示在桌面上,表面就是和瀏覽器脫離了關係,但是這樣應用AJAx則需一個底層框架如Bindows等
一、區域性重新整理:(我用一個例子來說明,實現下拉列表框的級聯)
區域性重新整理有三種方法可以完成:
1,、比較傳統的JAVAScript模式:
這種模式實現無重新整理:前臺定義指令碼方法FillData(strcity),接收的引數就是城市用來新增下拉列表框。後臺應用到RegisterClientScriptBlock方法註冊一個指令碼字串。這個指令碼字串用來根據不同城市來篩選出在此城市下的區縣。這樣就ok了(此處不詳解,如果不明白想了解的話給我留言~~~)
2、使用框架模式:
這種模式也是一種比較常見的模式。利用iframe,或frameset框架來實現區域性重新整理
3、AJAX實現:
此方法我用我最近一直在用的說明:我的專案有頁面時記錄的列表,然後再列表中的操作有通過點選一個按鈕圖片,展開掛在此條記錄下的子記錄,以此類推,可多層展示;這樣需要頁面無重新整理的顯示:
注意:起始頁面我用DataList展示父級記錄
具體操作是:在頁面按鈕處例如:<input type ="button" value="展開子集" onclick="ExpChild(<%#Eval("ID")%>)">,按鈕新增一個js函式,此函式通過id可獲得父級記錄的子集,並返回字串;然後再頁面處,每行父級記錄下隱藏一個div,或者如果你用table佈局可隱藏一個<tr>.重點來了~~~~ExpChild函式的寫法,直接例子(應用的AJAX是整合在JQuery中的):
function ExpProcess(id){
//此處通過ajax訪問一個頁面頁面呼叫方法然後給前臺response.write()一段子集字串,此處的Data就可以接受的到
var urls = "Ajax.aspx?act=getProcess&id=" + id;
// document.write(urls);
$.ajax({
type:"GET",
cache:false,
url:urls,
success:function(data){
$("#ProcessDiv_" + id).attr("innerHTML",data);//此處用來填充隱藏的子集div,已獲得子集資料
}
});
//此處是利用JQuery的toggle()方法自動控制隱藏部分顯隱
$("#ProcessTr_" + id).toggle();
$("#DairyTr_"+id).hide();
$("#Tr_"+id).hide();
}