jquery - 动态添加元素上的 JQuery 选择器

Question

我不知道如何哄 JQuery 选择在页面加载后动态插入到 DOM 中的元素（不是绑定处理程序）。

例如：

如果我有 HTML：

<div id="bar">
 World!
</div>

然后我创建一个新元素并将其插入到 DOM 中：

var foo = '<div id="foo">Hello</div>';
$("#bar").before(foo);

我最终得到了这个：

<div id="foo">Hello</div>
<div id="bar">
 World!
</div>

稍后我可能想对插入的元素做一些不同的事情，使用 JQuery 来操作那个新元素。但如果我尝试这样做：

myHappyEl = $("#foo");

那么 myHappyEl 将是未定义的。JQuery 看不到它，大概是因为它在 DOM 加载后附加。

我已经看到很多解决可能相关但略有不同的问题的建议，其中解决方案是使用 .live()/.on() 在元素出现时附加事件侦听器。如果我想捕捉点击事件之类的，那就太好了，但我不这样做；我希望能够选择动态添加的元素。

score 4 · Accepted Answer

您必须在插入元素后分配该变量，如下所示：

var myHappyEl = $("#foo"); //Nothing, it isnt there
var foo = '<div id="foo">Hello</div>';
$("#bar").before($(foo));
myHappyEl = $("#foo");

否则，页面上不存在该元素。

1 回答 1