jq给动态添加的元素绑定事件

最新推荐文章于 2023-11-09 11:24:12 发布

new money

最新推荐文章于 2023-11-09 11:24:12 发布

阅读量202

点赞数

文章标签： javascript css3 前端

本文链接：https://blog.csdn.net/work33/article/details/121210339

版权

这个博客展示了如何使用jQuery实现点击事件监听，并演示了如何阻止事件冒泡。通过`.box`元素的点击事件，动态添加新的`<p>`元素，并在内部`<p>`元素上设置点击事件处理，同时利用`event.stopPropagation()`防止事件向上冒泡。

摘要由CSDN通过智能技术生成

现在不用了live

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src=js/jquery-3.3.1.min.js></script>

</head>

<body>
    <div class="box">
        <button>click</button>
        <p>1</p>
        <p>1</p>
    </div>
</body>

</html>

<script>
    $(function () {
        $('.box').click(function () {
            $('p').after('<p>new</p>')
        })
        $('.box').on('click', 'p', function (e) {
            e.stopPropagation()
            console.log($(this));
        })
    })
</script>