Ajax叠加(Ajax返回数据用Ajax发出)示例代码
更新时间：2013年08月21日 15:05:07 作者：
把参数用Ajax发送到数据库进行查询然后用Ajax将数据发送到数据库签到表，于是有了下面的代码，感兴趣的朋友可以了解下，希望对大家学习ajax有所帮助
最近在做人事管理系统的一个签到功能，首先是把部门当做参数，把参数用Ajax发送到数据库进行查询，然后以表格形式动态生成员工信息到返回页面的Div里，表格最后的一列是签到按钮，这时我想用JQuery继续获取被点击的“签到”按钮，然后用Ajax将数据发送到数据库签到表，更新签到表，于是我就把每个签到按钮的id属性设置成第一次Ajax返回的每个员工信息的工号，再次用JQuery获取，怎么获取呢？想到了标签加事件选择器，于是写了下面代码：
$(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("服务器繁忙，请稍后再试！");
}
});
}
});
可是后来点击却发现没有获取到点击事件，点击按钮根本就没有反应，当我用浏览器查看返回的源码的时候，发现原来Ajax返回的HTML代码根本就没有被添加到页面中，这回怎么办呢？后来去百度里检索了半天，都说Ajax返回的数据无法用浏览器查看到源码，因为是异步的，检索了一天，头又大又疼，于是就晚上了，每次遇到大的问题，就赶紧睡觉，在梦中想实现方法，这样一方面可以休息，另一方面也可以解决问题，一般的时候第二天问题都会有答案，也都能实现。
第二天早晨醒来，思路还是没有，我想这次应该是大问题了，是不是我想要实现的不可能实现呢？百度里几乎没有用两次Ajax请求的，无奈之下在QQ空间发布了悬赏求助，悬赏是宴请三天三夜，后来终于我伟大的高中同学给了我帮助，当然不是因为悬赏才帮助我的，哈哈哈。
高中同学是这么说的，Jquery中有个live方法，可以获取动态生成的HTML代码元素，后来我就把live方法敲了进去，看了有三个参数event,data,function;于是查看了Jquery的帮助文档。
event：必需，规定附加到元素的一个或多个事件，由空格分隔多个事件。必须是有效的事件。
data：可选，规定传递到该函数的额外数据。
function：必需，规定当前事件发生时运行的函数。
这时的我这时大旱逢甘霖啊，于是写下下面代码：
$(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("服务器繁忙，请稍后再试！");
});
}
});
这次奇迹出现了，Ajax返回的按钮单击事件被获取到了，下面的Ajax异步过程也调用成功了，那种喜悦不能言表。
如果我放弃了这次求助，以后遇到同样的问题，我可能换一种思路，会用a标签代替按钮，跳转到另一界面，操作起来太麻烦了，哪个用户见到这样的效果都会恶心至极，同学这样的帮助岂三天三夜的宴请足矣？
复制代码 代码如下:
$(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("服务器繁忙，请稍后再试！");
}
});
}
});
可是后来点击却发现没有获取到点击事件，点击按钮根本就没有反应，当我用浏览器查看返回的源码的时候，发现原来Ajax返回的HTML代码根本就没有被添加到页面中，这回怎么办呢？后来去百度里检索了半天，都说Ajax返回的数据无法用浏览器查看到源码，因为是异步的，检索了一天，头又大又疼，于是就晚上了，每次遇到大的问题，就赶紧睡觉，在梦中想实现方法，这样一方面可以休息，另一方面也可以解决问题，一般的时候第二天问题都会有答案，也都能实现。
第二天早晨醒来，思路还是没有，我想这次应该是大问题了，是不是我想要实现的不可能实现呢？百度里几乎没有用两次Ajax请求的，无奈之下在QQ空间发布了悬赏求助，悬赏是宴请三天三夜，后来终于我伟大的高中同学给了我帮助，当然不是因为悬赏才帮助我的，哈哈哈。
高中同学是这么说的，Jquery中有个live方法，可以获取动态生成的HTML代码元素，后来我就把live方法敲了进去，看了有三个参数event,data,function;于是查看了Jquery的帮助文档。
event：必需，规定附加到元素的一个或多个事件，由空格分隔多个事件。必须是有效的事件。
data：可选，规定传递到该函数的额外数据。
function：必需，规定当前事件发生时运行的函数。
这时的我这时大旱逢甘霖啊，于是写下下面代码：
复制代码 代码如下:
$(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("服务器繁忙，请稍后再试！");
});
}
});
这次奇迹出现了，Ajax返回的按钮单击事件被获取到了，下面的Ajax异步过程也调用成功了，那种喜悦不能言表。
如果我放弃了这次求助，以后遇到同样的问题，我可能换一种思路，会用a标签代替按钮，跳转到另一界面，操作起来太麻烦了，哪个用户见到这样的效果都会恶心至极，同学这样的帮助岂三天三夜的宴请足矣？
相关文章
在JQuery中可以使用get，post和ajax方法给服务器端传递数据，接下来，通过本篇文章给大家介绍jquery中ajax-get()方法实例详解，有需要的朋友可以参考下2015-09-09
ajax刷新是一种用户体验良好的刷新方式,这篇文章主要介绍了ajax异步请求刷新,感兴趣的小伙伴们可以参考一下2016-08-08
这篇文章给大家介绍jquery ajax技术实现每隔一段时间向某页面传值，以及setinterval()方法的语法介绍，对本文感兴趣的朋友可以参考下2015-10-10
下面小编就为大家带来一篇完美解决ajax访问遇到Session失效的问题。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-06-06
支持跨域的Ajax异步(请求)提交类2009-07-07
在web页面中使用ajax加载进度条，可以让用户预先判断等待的时间，而且还可以减少用户等待信息加载过程中的心理焦虑感，所以进度条加载必不可少，下面小编给大家介绍ajax加载进度条代码是如何实现的2015-10-10
最近小编在研究嵌入式开发的课程设计，接下来通过本篇文章给介绍了Boa服务器下的ajax与cgi通信的相关资料，非常不错，具有参考借鉴价值，感兴趣的朋友一起看下吧2016-07-07
这篇文章主要为大家详细介绍了H5移动开发Ajax上传多张Base64格式图片到服务器，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-05-05
AJAX初级聊天室代码...2007-01-01
这篇文章主要介绍了pushState实现Ajax无刷新页面切换的相关资料,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-11-11
最新评论