Ajax叠加(Ajax返回数据用Ajax发出)示例代码
程序员文章站
2024-01-28 17:36:22
最近在做人事管理系统的一个签到功能,首先是把部门当做参数,把参数用ajax发送到数据库进行查询,然后以表格形式动态生成员工信息到返回页面的div里,表格最后的一列是签到按钮...
最近在做人事管理系统的一个签到功能,首先是把部门当做参数,把参数用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标签代替按钮,跳转到另一界面,操作起来太麻烦了,哪个用户见到这样的效果都会恶心至极,同学这样的帮助岂三天三夜的宴请足矣?
推荐阅读
-
Ajax叠加(Ajax返回数据用Ajax发出)示例代码
-
Ajax方式删除表格一行数据示例代码
-
google file system 用PHP获取Google AJAX Search API 数据的代码
-
google file system 用PHP获取Google AJAX Search API 数据的代码
-
jQuery使用ajax方法解析返回的json数据功能示例
-
jQuery使用ajax方法解析返回的json数据功能示例
-
ajax异步处理POST表单中的数据示例代码
-
jQuery中使用Ajax获取JSON格式数据示例代码
-
用ajax实现读博客rss示例代码
-
ajax后台处理返回json值示例代码