在jquery中實現ajax載入的方法有很多種,不像以前的js的ajax只有那一種,下面我們介紹jquery ajax實現局部載入方法總結,有需要瞭解的朋友可參考。
例
$.ajax({ url: "hotelQuery!queryHotelByCity.action", type: "post", dataType: "html", data: "queryHotel.city="+cityobj.value+"&queryHotel.wbcid="+wbcid, success: function(data){ $("#hotellists").html($(data).filter("#list").html()); } });
代碼解析:
從上面的代碼我們可以看出,返回的資料是data,但是我們如果在要ajax請求的頁面的那部分用id為list的一個DIV包圍起來,這樣我們通過$(data).filter("#list").html()就可以拿到DIV中的HTML內容
執行個體
$(document).ready(function(){ function loadMessage() { $(this).html("loading..."); var o = this; var xmlhttp = $.ajax({ url:"Service/IndexLogin.aspx", dataType:"html", success:function(result) { $(o).html(result); } }); } loadMessage.call($("#addinfo"));});<form action="#" method="post"> <ul id="addinfo"> 載入中... </ul></form>
上面我們使用的是的方法,其實還有更簡單的辦法哦,load() 方法通過 AJAX 請求從伺服器載入資料,並把返回的資料放置到指定的元素中
$(document).ready(function(){ $("#addinfo").load("Service/IndexLogin.aspx", $("#addinfo li")); })
1. 載入一個php檔案,該php檔案不含傳遞參數$("#myID").load("test.php");
//在id為#myID的元素裡匯入test.php運行後的結果
2. 載入一個php檔案,該php檔案含有一個傳遞參數
$("#myID").load("test.php",{"name" : "Adam"});
//匯入的php檔案含有一個傳遞參數,類似於:test.php?name=Adam
3. 載入一個php檔案,該php檔案含有多個傳遞參數。註:參數間用逗號分隔
$("#myID").load("test.php",{"name" : "Adam" ,"site":"61dh.com"});
//匯入的php檔案含有一個傳遞參數,類似於:test.php?name=Adam&site=61dh.com
4. 載入一個php檔案,該php檔案以數組作為傳遞參數
$("#myID").load("test.php",{'myinfo[]', ["Adam", "61dh.com"]});
//匯入的php檔案含有一個數組傳遞參數。
以上這篇jquery ajax局部載入方法詳解(實現代碼)就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支援雲棲社區。