gpt4 book ai didi

javascript - 单击页面中的动态元素时发生的事件

转载 作者:行者123 更新时间:2023-11-28 12:18:56 25 4
gpt4 key购买 nike

我有这段代码从数据库检索类别词(动态生成),然后使用 jQuery 附加到容器 html。这会在正文中生成以下内容;

<body>
<div id="container">
<div class="answer" id="opt1">Castle</div>&nbsp;&nbsp;&nbsp;
<div class="answer" id="opt2">Plate</div>&nbsp;&nbsp;&nbsp;
<div class="answer" id="opt3">Boy</div>&nbsp;&nbsp;&nbsp;
<div class="answer" id="opt4">Generous</div>&nbsp;&nbsp;&nbsp;
</div>
</body>

我的目标是检查鼠标是否点击了任何单词(城堡、盘子等),并启动一个事件,例如警报。为此,我尝试以下脚本;

$('.answer').click (function () {
alert("Hi"); //My Real goal - alert(this.id)
})

但是,这没有任何作用。如果我运行以下代码;

$('#container').click (function () {
alert("Hi");
})

单击任何单词时都会弹出一个窗口。但在这种情况下,我无法检索“this.id”。我真的不明白我做错了什么。有人可以给我解释一下吗?

jsfiddle

最佳答案

retrieve categories words (dynamically generated) from a DB, then append to the container html

听起来您正尝试在将答案项附加到 HTML 之前绑定(bind)事件。在这种情况下,最简单、最有效的解决方案是将事件委托(delegate)给父容器:

$('#container').on('click', '.answer', function () {
alert("Hi");
})

关于javascript - 单击页面中的动态元素时发生的事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42855843/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com