如果在pageload之后添加到DOM,则忽略click()代码的JQuery元素

Question

如果在pageload之后添加到DOM,则忽略click()代码的JQuery元素

所以我有一些代码,我在pageload之后向DOM添加了一个元素(下面的例子中的第二个链接)但是这个新添加的元素忽略了为它定义的所有函数.因此,对于下面的示例,我希望div中的所有链接都与测试类一起显示警报.适用于硬编码的链接,但之后添加的链接忽略它.

<html>
    <head>
        <title>SO Test</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    </head>
    <body>
        <div class="test">
            <a href="#" title="Test">Test Link</a>
        </div>
        <script type="text/javascript">
        <!--    
            $(document).ready(function() {

                $("div.test a").click(function() {
                    alert("click");
                    return false;
                });

                $(document.createElement("a")).attr("href","#").text("Test Link 2").appendTo("div.test");

            });
        -->
        </script>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

编辑:是唯一的解决方案,用jQuery插件抽象它？

Answer 1

Six*_*tto 14

您的问题是click()将事件侦听器绑定到当前匹配集中的每个元素.这不是魔术,它不会追溯性地将事件监听器应用于您添加到DOM的新内容.你的选择是:

正如其他人所提到的,使用jQuery中的实时事件功能.
通过将单击处理程序绑定到您感兴趣的元素的一些共同祖先,然后测试您看到的每个单击的目标来确定您是否关心它,自己做类似的事情.例如:
```
$(function(){
  $("div.test").click(function(e){
    if( $(e.target).is("a") ) {
      alert("click");
      return false;
    });
  });
});
```
Run Code Online (Sandbox Code Playgroud)

在将新元素添加到DOM的代码中,还将事件处理程序绑定到它们.例如:

$(document.createElement("a"))
  .attr("href","#")
  .text("Test Link 2")
  .click(function(){ alert("click"); })
  .appendTo("div.test");

Run Code Online (Sandbox Code Playgroud)

归档时间：	16 年前
查看次数：	6887 次
最近记录：	8 年，10 月前