首页 / JQUERY / jQuery获取动态生成的元素示例

jQuery获取动态生成的元素示例

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了jQuery获取动态生成的元素示例，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1403字，纯文字阅读大概需要3分钟。

内容图文

需求描述：页面上可以动态添加数据,比如table,点击按钮可以动态添加行。又或页面
加载时table数据是通过ajax从后台获取的。而这时我们想要获取其中的某个值,又该如何获取呢？

如果是要通过某个事件来获取的比如click,mouseover等等,则可以使用live()方法
代码如下:

$(".button").live("click",function(){ 
console.info($("#mytd").html()); 
}) 
 
而如果不是通过某个事件,当页面加载的时候我们就要获取值或进行其他操作 

live()方法就不行了,因为我们无法传入一个事件。 

比如以下代码： 
 代码如下:

<body> 
<table id="tab" border="1" width="30%"> 

</table> 
</body> 
<script type="text/javascript"> 
$(function() { 
$.post("admin/UserForumthemeBabygrowupFrontList.do",{},function(data){ 
console.info(data.table); 
$("#tab").append(data.table); 
}) 

alert($("#mytd").html()); //获取值 
}); 
</script> 
 
以上代码很简单,就是通过post从后台返回的值添加到<table>中 

后台返回数据为 <tr><td id='mytd'>北京</td><td>深圳</td></tr>而我们要在post之后获取id为mytd的值, 

此时是获取不到的,我们从浏览器中就可以观察出问题： 
jQuery获取动态生成的元素示例 - 文章图片 
从以上可以看出在alert的时候 数据并还没有加载出来 控制台也并没有打印出信息,所以此时是取不到数据的。 

使用ajaxComplete()方法可以在请求完成时运行要执行的代码,我们修改为如下： 
 代码如下:

$(function() { 
$.post("admin/UserForumthemeBabygrowupFrontList.do",{},function(data){ 
console.info(data.table); 
$("#tab").append(data.table); 
}) 
$("#tab").ajaxComplete(function(){ //待请求完成时 执行 
alert($("#mytd").html()); 
}) 
}); 
 
jQuery获取动态生成的元素示例 - 文章图片 
此时再获取的时候页面已加载完数据。

内容总结

以上是互联网集市为您收集整理的jQuery获取动态生成的元素示例全部内容，希望文章能够帮你解决jQuery获取动态生成的元素示例所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/362059.html

来源：【匿名】