Question

我有一个html组件，在单击按钮后将重新加载。组件的某些元素绑定到单击和悬停处理程序。在调用.load() - 函数重新加载组件之前，一切正常。加载的组件的元素未绑定到相应的处理程序。

此时我将js-script放在组件的末尾，以便绑定元素。但是在组件重新加载之后，组件外部的元素现在还没有绑定。

我已尝试使用.on()，.live()，.bind()，.click()，......没有任何效果。

Answer 1

您应该能够调用.load()方法并创建一个可以重新绑定元素的回调。

例如：

$(document).ready(function() {
    ...initially bind all event handlers for page (including elements to be reloaded)...

    $("#someButton").on("click", function() { 
        $("#elementToReload").load("page-to-load.html", function() {
             ...bind all event handlers for this and containing elements here...
        });
    });
});

如果您对此有任何疑问，请与我们联系。祝好运！：）

Answer 2

我不确定你绑定事件的方式，但基本上，如果你这样做的话：

$('.your-class').on('click', function (e) {[...]});

您可能最好将其委托给未重新加载的文档。

$(document).on('click', '.your-class', function (e) {[...]});

您可以确定即使脚本执行时不存在的元素也会被绑定，因为它们将成为您文档的一部分，以后。

jQuery，如何在.load（）之后重新绑定html元素

2 个答案: