jquery live（）向现在及未来元素绑定事件

最新推荐文章于 2023-11-28 10:30:12 发布

转载最新推荐文章于 2023-11-28 10:30:12 发布 · 792 阅读

文章标签：

#jquery

jquery 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一个使用jQuery简化DOM操作的示例。当点击页面上的段落元素时，该元素会隐藏或显示；同时，通过按钮可以动态创建新的段落元素，并确保新增元素也能响应点击事件。

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

<html>
    <head>
    <script type="text/javascript" src="/jquery/jquery.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
      $("p").live("click",function(){
        $(this).slideToggle();
      });
      $("button").click(function(){
        $("<p>This is a new paragraph.</p>").insertAfter("button");
      });
    });
    </script>
    </head>
    <body>
    <p>这是一个段落。</p>
    <p>点击任意 p 元素会令其消失。包括本段落。</p>
    <button>在本按钮后面插入新的 p 元素</button>
    <p><b>注释：</b>通过使用 live() 方法而不是 bind() 方法，新的 p 元素同样会在点击时消失。</p>
    </body>
</html>