如何在ajax调用后删除和重新加载jQuery / javascript函数

Question

我们说我有这段代码：

<div id="content">
</div>

我使用一个简单的ajax请求来填充内容，当我点击某个按钮

时，这些数据有效

    $.get("page?num=" + pageNumber, function(data){
                $("div#content").html(data);
});

一次数据

<div id="Data1">
</div>

和其他时间

<div id="Data2">
</div>

对于每个id，我有不同的jquery函数。例如：

$('#Data1').click(function(){});

有些功能相似，有些则不同。

我的问题 - 如果我点击按钮，我会加载我需要的所有脚本。当我点击另一个按钮时，我需要再次为新内容加载脚本，但是与之前内容相关的旧功能会发生什么？每次单击我都会加载新脚本而不删除最后一个。

如何正确删除/管理我的脚本？

感谢， 阿龙

Answer 1

我不确定我是否理解你的问题。你期待像

这样的东西吗？

$("div#content").html(""); // deleting existing data
$("div#content").html(new_data); //loading new data

Answer 2

jQuery在调用它们时将事件绑定到DOM对象（divs）。这意味着它会查找具有给定ID的元素，然后将其绑定。由于在运行脚本时Edit1和Edit2不存在，因此它们不受约束。

每次更改ID时都可以尝试绑定它们。

function rebind() {
    $('#content').click(function(){});
    $('#Data1').click(function(){});
    $('#Data2').click(function(){});
}

每当您在div中加载新内容时，请调用此方法。

Answer 3

Gurung对事件处理程序是正确的，但是从jQuery 1.7开始，不推荐使用.live（）方法。使用.on（）代替事件处理程序。

（我无法将这些信息作为评论发布，所以它必须是一个新的答案，对不起，aboyt）。

Answer 4

可以使用.live()函数。

  

描述：为现在和将来与当前选择器匹配的所有元素附加事件处理程序。