gpt4 book ai didi

javascript - 单击事件不适用于由 javascript 创建的文本

转载 作者:行者123 更新时间:2023-12-03 02:05:27 25 4
gpt4 key购买 nike

在您在文本下方看到的代码中,有一个 <div>我在里面写了“Hello World”。我基于 jQuery 进行编码,当我单击 <div> 时该类名称是 test它创建了一个新的 <div class="test">.. .

问题是,当我单击使用类名 test 生成的新元素时对于文本“Book”,它不会创建新元素,就像我单击“Hello World”一样,它会再次生成新元素。

如果有人帮助我解决这个问题,我将不胜感激。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".test").click(function(){
$(this).after('<div class="test">Book</div>');
});
});
</script>
</head>
<body>
<div class="test">
Hello World
</div>
</body>
</html>

$(document).ready(function(){
$(".test").click(function(){
$(this).after('<div class="test">Book</div>');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="test">
Hello World
</div>

最佳答案

问题是 click() 仅适用于页面加载时已经存在的元素。使用 on() 尝试以下操作:

$(document).ready(function(){
$('body').on('click', '.test', function () {
$(this).after('<div class="test">Book</div>');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</script>
<div class="test">
Hello World
</div>

on 事件将一个或多个事件的事件处理函数附加到所选元素,无论这些元素位于主体上。

关于javascript - 单击事件不适用于由 javascript 创建的文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49829282/

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