Javascript 从随后分配的类触发事件

我需要动态地向元素添加一个类。但是在添加类之后，与该类相关的所有事件仅从元素开始工作，这些元素的类在加载文档时已经定义

<button>Add class to Text 1</button><br />
<a href="#">Text 1</a> <br />
<a href="#" class="myClass">Text 2</a>

<script>
$(document).ready(function() {
  $("button").click(function() {
    $("a").addClass("myClass");
  });
  $(".myClass").click(function() {
    alert("clicked!");
  });
});
</script>

考虑这个例子。

Text 1

还没有类，而

Text 2

有类。单击按钮时，myClass被分配给

文本1

，因此文本1和文本2现在都来自myClass。
单击myClass的某个元素时，应显示一个警报框，但此事件仅在单击

Text 2

时触发。元素，其类在加载文档时已定义

<button>Add class to Text 1</button><br />
<a href="#">Text 1</a> <br />
<a href="#" class="myClass">Text 2</a>

<script>
$(document).ready(function() {
  $("button").click(function() {
    $("a").addClass("myClass");
  });
  $(".myClass").click(function() {
    alert("clicked!");
  });
});
</script>

将类添加到文本1



$（文档）.ready（函数（）{
$（“按钮”）。单击（函数（）{
$（“a”）.addClass（“myClass”）；
});
$（“.myClass”）。单击（函数（）{
警报（“单击！”）；
});
});

---

这里有一把小提琴：

一个选择是使用。这样，事件将附加到一个常量父元素，并且在实际触发事件时（而不是附加事件时）检查子元素的类

您应该将事件侦听器附加到公共祖先元素，但在本例中，我将其附加到

文档

，因为您没有提供任何附加标记

与动态加载内容一样，这将解决上述问题

---

关于此主题的其他参考资料：和。

$(".myClass").click(function() {
   alert("clicked!");
});

// Is the same as:

$("body").on("click", ".myClass",function() {
   alert("clicked!");
});