<分区>
<分区>
为什么我无法获取这个新添加的多个子 div 的 text
。我正在使用 JQuery 添加此动态元素。这是我的示例 fiddle :JSFIDDLE
有人可以向我解释我哪里出错了吗?
脚本
var counter = 0;
$("button").click(function() {
$("<div class='child-list-workorder'>\
<div class='list-workorder'>\
<div class='list-workorder-header'>\
<h3 id='" + counter + "' class='list-workorder-id'>click me " + (++counter) + "</h3>\
</div>\
<p>" + counter + "</p>\
</div>\
</div>").appendTo("div.parent-list-workorder");
});
$("div.list-workorder-header").on("click", "h3.list-workorder-id", function(){
alert(this.id);
});
最佳答案
你必须使用 delegated event因为 html 是动态生成的:
$(document).on("click", "h3.list-workorder-id", function(){
alert(this.id);
});
你的 child-list-workorder 类的 div 也是动态生成的,所以:
$(".child-list-workorder").on("click", "h3.list-workorder-id", function(){
...............
将不起作用,因为它也是动态生成的。
或者您可以使用具有在 DOM 加载时加载的类 parent-list-workorder 的父 div:
$(".parent-list-workorder").on("click", "h3.list-workorder-id", function(){
alert(this.id);
});
关于jquery - 使用 JQuery 新添加的具有多个 div 的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26419815/
相关文章:
javascript - 全日历.io : how to display one event per line in agendaWeek then mix all in one?
javascript - jQuery 的 slideDown() 问题
python - CSS 定位器 : unable to locate element via code
javascript - CSS, "-webkit-animation"在 Google Chrome 上占用过多 CPU
javascript - Jquery 在 AJAX 表单结果显示中没有响应
jquery - 如何使用 HTML5 History/State API 并保持带主题标签的超链接(文档内的链接)完好无损