lilunze / lilunze.github.io

blog
1 stars 0 forks source link

jquery动态dom绑定click事件移动端不兼容 #5

Open lilunze opened 6 years ago

lilunze commented 6 years ago

当使用jQuery的append函数动态添加dom节点,给该节点添加click事件没有效果,代码如下:

var obj="<div id='container'>点击</div>"
$(obj).appendTo($("body"));
$("#container").click(function()
{
    //要执行的函数
})

因为$(“#container”)这个元素是通过脚本动态加入到body中的,所以无法利用传统的事件绑定为其添加事件,那么我们就需要需要采用另外一种方式,也就是JavaScript的事件冒泡和委托机制,代码如下:

var obj="<div id='container'>点击</div>"
$(obj).appendTo($("body"));
$("body").delegate("#container","click",function()
{
    //要执行的函数
})

以上修改可能只在pc端适用,如果在移动端以上方式绑定依然不能正常执行,那么我们仍然可以采用下面的方式来解决: