使用jQuery replaceWith仅在第一次使用时替换DIV的内容

我正在使用以下jQuery来提取新数据并替换DIV listdata的内容

$(function(){ $('.refresh').click(function(event) { event.preventDefault(); $.ajax({ url: "_js/data.php", success: function(results){ $('#listdata').replaceWith(results); } }); }); }); 

该脚本由页面上的众多链接触发，例如：

 Update 1 Update 2 

由于某种原因，该脚本仅适用于第一次链接。 后续点击不会刷新数据。

我已经看到了各种修复，但没有任何我可以工作的东西。 有什么建议？

Answer 1

它看起来像你的问题是使用replaceWith 。

在第一次调用replaceWith ，您将删除与$('#listdata')匹配的元素，因此后续刷新无法找到数据应放在文档中的位置。

你可以试试像

  $('#listdata').empty(); $('#listdata').append(results); 

或者像这样链接

  $('#listdata').empty().append(results); 

Answer 2

如果您正在使用replaceWith() ，那么您将#listdata用一个全新的元素替换#listdata 。

如果data不是像

那么#listdata在replaceWith()之后就会消失。 我想你应该使用html()代替。

Answer 3

您需要将链接上的href更改为 … 。 这可以防止在单击链接时刷新浏览器。

如果你这样做，你也会想要在点击处理程序的末尾加上“return false”以防止冒泡。

Answer 4

尝试：

 $('a.refresh').live('click', function(e) { e.preventDefault(); $.ajax({ url: '_js/data.php', success: function(data) { $('#listdata').empty().html(data); } }); }); 

---

如果.refresh锚在#listdata元素内，那么委托是一个更优化的解决方案：

 var list = $('#listdata'); list.delegate('a.refresh', 'click', function(e) { e.preventDefault(); $.ajax({ url: '_js/data.php', success: function(data) { list.empty().html(data); } }); });