使用jQuery .load导致新的div链接无法正常工作

Question

我更换使用jQuery AJAX负载在一个新的div来加载一个div更换事业部：

$("td.prod2").click(function(){ 
    $("#products-details").load("/products/Test.aspx"); 
    }); 

新DIV设有一个无序列表取代了先前的无序列表：

<ul> 
<li><a href="">Link 1</li> 
<li><a href="">Link 2</li> 
<li><a href="">Link 3</li> 
</ul> 

当我点击新div中的链接时，原始div的内容会重新加载到页面上？

任何想法？

Answer 1

尝试使用live来代替绑定事件。这将确保当DOM改变你的新内容将有事件......

$('td.prod2').live('click', function() { 
    $("#products-details").load('/products/Test.aspx'); 
}); 

这绝对应该解决您遇到的问题。

有关live查看更多细节：http://api.jquery.com/live/

更新：你上面包含的代码看起来是不完整的...什么是你从“/products/Test.aspx”加载的内容？我假设它包含几个<td class="prod2">，应该将此事件绑定。

Answer 2

当您替换具有事件侦听器的元素时，这些侦听器将断开连接。您需要重新初始化它们或使用jQuery的.live()功能。