javascript - ajax jquery 和点击事件

Question

我有几个具有相同类别“取消关注”的按钮。
当用户单击其中一个按钮时，它会触发 ajax 请求并将类更改为“follow”，并向该类添加一个单击监听器。
当用户单击“关注”按钮时，它会触发一个新的 ajax 请求并将类更改为“取消关注”。
现在的结果是，当用户单击“取消关注”链接时，一切顺利，但是当用户单击“关注”按钮时，它会触发 2 个 ajax 请求，1 个“取消关注”和 1 个“关注”。< br/>

已解决

新代码:
promise 模拟 ajax 请求

$('.btn').click(function(event) {
  var $self = $(this);
  var screenName = $self.parent().prev().children().children('p').text().substring(1);

  if ($self.hasClass('unfollow')) {
    var unfollowReq = new Promise(function(resolve, reject) {
      $self.removeClass('unfollow').addClass('follow');
      $self.text('Follow');
      console.log('Unfollow');
      resolve();
    });
  } else if ($self.hasClass('follow')){
    var unfollowReq = new Promise(function(resolve, reject) {
      $self.removeClass('follow').addClass('unfollow');
      $self.text('Unfollow');
      console.log('Follow');
      resolve();
    });
  }
});

已更新JSFiddle

问候，
利亚德。

Answer 1

您必须在关注点击后删除关注事件监听器。

为此使用 unbind()。

https://api.jquery.com/unbind/