快捷導(dǎo)航

Ajax疊加(Ajax返回數(shù)據(jù)用Ajax發(fā)出)示例代碼

更新時間：2013年08月21日 15:05:07 作者：

把參數(shù)用Ajax發(fā)送到數(shù)據(jù)庫進(jìn)行查詢?nèi)缓笥肁jax將數(shù)據(jù)發(fā)送到數(shù)據(jù)庫簽到表，于是有了下面的代碼，感興趣的朋友可以了解下，希望對大家學(xué)習(xí)ajax有所幫助

最近在做人事管理系統(tǒng)的一個簽到功能，首先是把部門當(dāng)做參數(shù)，把參數(shù)用Ajax發(fā)送到數(shù)據(jù)庫進(jìn)行查詢，然后以表格形式動態(tài)生成員工信息到返回頁面的Div里，表格最后的一列是簽到按鈕，這時我想用JQuery繼續(xù)獲取被點(diǎn)擊的“簽到”按鈕，然后用Ajax將數(shù)據(jù)發(fā)送到數(shù)據(jù)庫簽到表，更新簽到表，于是我就把每個簽到按鈕的id屬性設(shè)置成第一次Ajax返回的每個員工信息的工號，再次用JQuery獲取，怎么獲取呢？想到了標(biāo)簽加事件選擇器，于是寫了下面代碼：

復(fù)制代碼代碼如下:

 
$(function(){ 
$("tr input:button").click(){ 
$.ajax({ 
type: "POST", 
url: "page_helper.ashx", 
data: "name=K&pid" + $(this).attr("id"), 
success: function (html) { 
$("#ReturnHTML").html(html); 
}, 
error: function () { 
alert("服務(wù)器繁忙，請稍后再試！"); 
} 
}); 
} 
}); 

可是后來點(diǎn)擊卻發(fā)現(xiàn)沒有獲取到點(diǎn)擊事件，點(diǎn)擊按鈕根本就沒有反應(yīng)，當(dāng)我用瀏覽器查看返回的源碼的時候，發(fā)現(xiàn)原來Ajax返回的HTML代碼根本就沒有被添加到頁面中，這回怎么辦呢？后來去百度里檢索了半天，都說Ajax返回的數(shù)據(jù)無法用瀏覽器查看到源碼，因?yàn)槭钱惒降?，檢索了一天，頭又大又疼，于是就晚上了，每次遇到大的問題，就趕緊睡覺，在夢中想實(shí)現(xiàn)方法，這樣一方面可以休息，另一方面也可以解決問題，一般的時候第二天問題都會有答案，也都能實(shí)現(xiàn)。

第二天早晨醒來，思路還是沒有，我想這次應(yīng)該是大問題了，是不是我想要實(shí)現(xiàn)的不可能實(shí)現(xiàn)呢？百度里幾乎沒有用兩次Ajax請求的，無奈之下在QQ空間發(fā)布了懸賞求助，懸賞是宴請三天三夜，后來終于我偉大的高中同學(xué)給了我?guī)椭?，?dāng)然不是因?yàn)閼屹p才幫助我的，哈哈哈。

高中同學(xué)是這么說的，Jquery中有個live方法，可以獲取動態(tài)生成的HTML代碼元素，后來我就把live方法敲了進(jìn)去，看了有三個參數(shù)event,data,function;于是查看了Jquery的幫助文檔。
event：必需，規(guī)定附加到元素的一個或多個事件，由空格分隔多個事件。必須是有效的事件。
data：可選，規(guī)定傳遞到該函數(shù)的額外數(shù)據(jù)。
function：必需，規(guī)定當(dāng)前事件發(fā)生時運(yùn)行的函數(shù)。

這時的我這時大旱逢甘霖啊，于是寫下下面代碼：

復(fù)制代碼代碼如下:

 
$(function(){ 
$("tr input:button").live("click", function () { 
$.ajax({ 
type: "POST", 
url: "page_helper.ashx", 
data: "name=JS&pid=" + $(this).attr("id") + jsparam(), 
success: function (html) { 
alert(html); 
}, 
error: function () { 
alert("服務(wù)器繁忙，請稍后再試！"); 
}); 
} 
}); 

這次奇跡出現(xiàn)了，Ajax返回的按鈕單擊事件被獲取到了，下面的Ajax異步過程也調(diào)用成功了，那種喜悅不能言表。
如果我放棄了這次求助，以后遇到同樣的問題，我可能換一種思路，會用a標(biāo)簽代替按鈕，跳轉(zhuǎn)到另一界面，操作起來太麻煩了，哪個用戶見到這樣的效果都會惡心至極，同學(xué)這樣的幫助豈三天三夜的宴請足矣？