-2

lib-used:- http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js

jquery

$(document).ready(function(){
       $("#dynamic").append("<div class=id1>Dynamically created click</div>");
       $("#id1").click(function(){
        alert("triggerd func is:"+(this));
     });
});

html

<body>
    <div id="id1">Hard Coded Click</div><!-- working -->
    </br>
    <div id="dynamic"></div><!-- not working -->
</body>
4

4 回答 4

2

你的原因是..你的点击事件选择所有id为id1的元素，所以动态添加的元素有类而不是id..所以事件不起作用......

一种方法是

您的选择器应该是类选择器...而不是 id ...在委托事件上用于动态添加的元素以使该事件起作用。

 $("#dynamic").on('click','.id1',function(){
                alert("triggerd func is:"+(this));


  });

注意： id 应该始终是唯一的，并且要使硬编码的 div 正常工作，您应该将 id 更改为 class

  <div class="id1">Hard Coded Click</div><!-- working -->
   //--^^^^^----here
于 2013-07-31T06:06:45.733 回答
1

这些答案确实包含正确的代码（使用 on），但它们没有解释这样一个事实，即为了让您的点击侦听器触发，使用 click() 方法，必须在绑定事件之前加载元素。

因此这将起作用：

$("#dynamic").append("<div class='id1'>Dynamically created click</div>");
$(".id1").click(function(){
    alert("triggerd func is:"+(this));
});

但这不会

$(".id1").click(function(){
    alert("triggerd func is:"+(this));
});
$("#dynamic").append("<div class='id1'>Dynamically created click</div>");

所以基本上如果你使用.on('click', '.id1', ....)它会以任何一种方式触发。

同样为了让所有内容都在同一个答案中，您的选择器基于 ID 属性而不是您正在使用的类名。

于 2013-07-31T06:32:07.910 回答
0

您正在将点击事件绑定到 Id = id1 的元素。如果您单击具有不同 Id 的元素，它将不会被触发。

将类添加到两个 div 并将单击事件选择器调整为该类，即。

$("body").on("click", ".divsClass", function(){
            alert("triggerd func is:"+(this));
});
于 2013-07-31T06:07:15.087 回答
0

使用 on 而不是 click.Code 将是这样的

$(document).on('click','.id1',function(){
        alert("triggerd func is:"+(this));
});

我希望它会有所帮助

于 2013-07-31T06:20:16.560 回答