Question

我正在使用Like按钮。它工作正常。在Like按钮完成它的功能之后，我正在尝试更新按钮文本（喜欢喜欢）而不刷新页面，但问题是它正在更新网页上的每个Like按钮（直到我刷新页面）而不仅仅是一个我点击了。。

这是AJAX调用中的成功函数，

$('.like-click').click(function(e){
e.preventDefault();

var this_ = $(this);
var quesURL = this_.attr('like-href');
$.ajax({
    url: quesURL,
    method: 'GET',
    data: {},
    success: function (data) {
        var like_text = $(data).find('.like-click').html();
        $('.like-click').html(like_text);
    }
})
});

这是HTML，

{% for data in datas %}
     ....
     <a class="like-click" like-href="...">{% if user in Likes %}Liked{% else %}Like{% endif %}</a>
     ....
{% endfor %}

如何只更新我点击的按钮而不是全部按钮？

Answer 1

您的成功功能通常会更新所有类元素＆＃34; .like-click＆＃34;。如果要更新单个元素，请使用唯一ID以唯一方式标识元素。单击发出id时，然后更新过滤器时仅更新具有该id的元素。

Answer 2

将$('.like-click').html(like_text);更改为

$(this).html(like_text);以定位要点击的元素。

$('.like-click').click(function(e){
e.preventDefault();

var this_ = $(this);
var quesURL = this_.attr('like-href');
$.ajax({
    url: quesURL,
    method: 'GET',
    data: {},
    success: function (data) {
        var like_text = $(data).find('.like-click').html();
        $(this).html(like_text);
    }
  });
});

单击后更新Like按钮

2 个答案: