【jQuery】对动态添加的元素绑定事件

程序员不丑009

于 2020-11-19 16:44:08 发布

阅读量362

点赞数

分类专栏：前端知识文章标签： jquery

本文链接：https://blog.youkuaiyun.com/u013517229/article/details/109817059

版权

前端知识专栏收录该内容

13 篇文章

订阅专栏

jQuery简化了DOM操作，本文介绍其绑定点击事件的两种常用方法。一是$(“selector”).click(callback)，点击部分元素可触发；二是$(document).on(“click”, “selector”, callback)，点击更多元素都能触发。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

jQuery的出现，大大简化了对dom的操作。对点击事件的绑定，有两种常用的方法。第一种是$(“selector”).click(callback)；第二种是$(document).on(“click”, “selector”, callback)。

1、$(“selector”).click(callback)

<li class=”liClass”>1</li>
<li class=”liClass”>2</li>

<script>
$(“.liClass”).click(function(){ alert(“Hello World!”) })
$(“body”).append(“<li class=’liClass’>3</li>”)
</script>

结果：点击li1和li2能够触发点击事件，点击li3不能触发。

2、$(document).on(“click”, “selector”, callback)

<li class=”liClass”>1</li>
<li class=”liClass”>2</li>

<script>
$(document).on(“click”, “.liClass”, function(){ alert(“Hello World!”) })
$(“body”).append(“<li class=’liClass’>3</li>”)
</script>

结果：点击li1、li2、li3都可以触发点击事件。