挺简单的问题,就是不好描述哈...,不知道能不能理解
<body>
<button class="btn">添加Button按钮</button>
<div class="container">
<button class="item">Button</button>
</div>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
(function bindEvent() {
$(".item").click(function() {
alert("Hello");
});
})();
$(".btn").on("click", function() {
$(".container").append("<button class=\"item\">Button</button>")
});
</script>
</body>
上面只是一个使用js添加一个按钮的例子。页面一开始是有一个按钮的,按钮绑定了一个点击事件。现在通过js再添加一个一样的按钮,很明显,之后手动添加的按钮并没有绑定
Click
事件,要想这个按钮也有点击事件,我能想到的就是:重新使用bindEvent()
方法绑定才行:
$(".btn").on("click", function() {
$(".container").append("<button class=\"item\">Button</button>")
//为按钮绑定Click方法,同时也为一开始就有的按钮也重新绑定了一次事件,这样会不会对性能有影响?毕竟随着按钮越来越多,要绑定事件的按钮也越多了。
(function bindEvent() {
$(".item").click(function() {
alert("Hello");
});
})();
});
我想问的问题已经在上面的注释中写明。之所以问这个问题是因为最近在做一个下拉刷新,每次下拉就发送一个异步请求,再把结果添加到页面中去,然后都要为新加入的dom重新绑定一次事件,不知道这样会不会对性能有影响?
哈哈哈,求点赞啊
关于这个问题 利用时间委托和事件冒泡就可以解决,你的js时间绑定有问题,稍微修改一下就可以了
$(".container").on('click','.item',function() {
});