Javascript 使用jQuery replaceWith替换第一次工作的DIV的内容

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

$(function(){
$('.refresh').click(function(event) {
    event.preventDefault();

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

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

<a href="" id="update1" class="refresh">Update 1</a>
<a href="" id="update2" class="refresh">Update 2</a>

出于某种原因，该脚本仅在第一次单击链接时起作用。后续单击不会刷新数据

我已经看到了各种各样的修复方法，但是没有一种方法可以让我工作。有什么建议吗？

试试：

$('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);
        }
    });
});

---

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

---

如果您以这种方式进行操作，您还需要在单击处理程序的末尾粘贴一个“return false”以防止冒泡。

在我看来，您的问题在于使用

replaceWith

在第一次调用

replaceWith

时，您正在删除与

$（“#listdata”）

匹配的元素，因此后续刷新无法找到数据应该放在文档中的位置

你可以试试类似的东西

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

还是像这样被锁着

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

---

如果您使用的是

replaceWith（）

，那么您将用一个全新的元素替换

#listdata

---

如果

数据

与

不同，则

#列表数据

在

replaceWith（）之后消失。我认为您可能应该使用
html（）
。
此外，冒泡在这里不是问题。请记住，使用
.delegate（）
解决方案，您将替换
#listdata
元素本身，因此您将丢失
.delegate（）
处理程序。编辑：您可以执行
list.parent（）.delegate（“#listdata a.refresh”，“cli…”
不幸的是，这是我试图解决的第一件事，但运气不好。我认为Sam的答案是正确的，因为replaceWith正在删除div。不幸的是，我仍然没有接近答案。@Paul…但是如果.refresh元素不在#listdata元素内，那么您就不需要使用live/delegate点击就可以了。我想你已经一针见血了，但这个特定的修复方案不起作用。对不起，我错过了你将replacetwith切换为append的机会。太好了！@EBM，你应该就此提出一个问题。如果这个解决方案对你不起作用，那么你所做的事情就有些不同了。这让我发疯了好长时间，然后我就离开了最终解决了问题。根据Sam Duel的回答，问题是replaceWith正在替换整个html，因此特定的id（或类）已被重新计算，因此为什么不在那里选择第二次！我的解决方案是确保replacment html具有我选择的类，以确保我第二次选择它