Javascript 附加到Body元素的jQuery多点单击事件（AJAX加载的内容）

我使用PHP访问TwitterAPI和AJAX请求来执行操作，而无需刷新页面

在我当前的设置中，当页面第一次加载时，它是空白的。使用jQuery，在

document.ready（）

上执行一个AJAX请求，该请求指向一个PHP页面，该页面获取一个时间轴，以字符串形式构建HTML结构，并将其返回给AJAX成功函数。然后，我将其附加到一个以HTML形式呈现的div中

我遇到的问题是，因为我有太多动态生成的内容，我在jQuery中的单击事件会相互覆盖。我有几个

.on（“click”）

事件附加到

主体

元素（因为它们不存在于

文档.ready（）

）

这样做的结果是，代码中最底层的事件监听器可以工作，但上层的其他监听器不能工作。我如何解决这个问题？我的第一个想法是

e.stopPropogation

或

e.stoppimediateproposition

，因为我想我以前在类似的情况下也使用过它们，但我不太确定

---

提前感谢您的建议

完成对服务器的请求后，尝试将事件绑定到ajax的success（）函数中的元素

AJAX

        $.ajax({
            url : 'process.php',
            data: { ... },
            success : function(data) {
                document.getElementById("my-element").innerHTML = data;
                $('#loaded-element').bind('click', function(){
                    ...
                });
            }
        });

---

为什么不将

$（'body'）.unbind（'click'）.on（'click'，'element'，function（e）{…}

在根元素上，这样它就不会在动态内容加载后重新绑定？不清楚你在问什么；你真的想知道为什么以前的点击处理程序不再执行了，当你在添加一个新的点击处理程序之前删除所有点击处理程序时…？@shayanypn不会将其绑定到

$（'html'）

仍然存在与

$（'body'）

？@CBroe我如何删除它们？请解释。谢谢。这解决了代码顶部单击事件绑定的问题，但现在底部的一个（以前工作过的）现在不起作用了：（编辑：我意识到我现在可以将我的点击事件绑定到实际的选择器，因为它们是在元素添加到页面之后添加的。所以现在它们都可以工作了。谢谢！

        $.ajax({
            url : 'process.php',
            data: { ... },
            success : function(data) {
                document.getElementById("my-element").innerHTML = data;
                $('#loaded-element').bind('click', function(){
                    ...
                });
            }
        });