Question

提交ajax请求时，我想在发送之前切换一个类，在错误时将其切换回来，或者如果一切都结果正确则保留它。但$(this)选择器似乎没有工作，我不知道为什么。我正在使用jQuery 1.4.3。

HTML 的

<a class="vote-down vote-down-112 state-3" data-postid="112" data-voteid="6">down</a>

JS

$('.vote-down').click(function() {
    var voteData = '&postId=' + $(this).data('postId') + '&voteId=' + $(this).data('voteid');
    $.ajax({
        dataType: 'script',
        url: "myURL" + "?format=js" + voteData,
        error: function(XMLHttpRequest, textStatus, errorThrown) { $(this).toggleClass("status-3"); },
        beforeSend: function(XMLHttpRequest) { $(this).toggleClass("status-3"); }
    });
    return false;
});

Answer 1

this默认情况下引用ajax对象本身，如果您希望this具体，请使用context option设置this是什么在你的回调中，像这样：

$('.vote-down').click(function() {
  var voteData = '&postId=' + $(this).data('postId') + 
                 '&voteId=' + $(this).data('voteid');
  $.ajax({
     context: this,
     dataType: 'script',
     url: "myURL" + "?format=js" + voteData,
     error: function() { $(this).toggleClass("status-3"); },
     beforeSend: function() { $(this).toggleClass("status-3"); }
  });
  return false;
});

我删除了函数参数只是为了清理，如果你不使用它们就不需要它们。

Answer 2

常见错误。 this指的是XHR请求，而不是元素：

$('.vote-down').click(function() {
  var that = this; // save a reference to the element;

  $.ajax({
    dataType: 'script',
    url: "myURL" + "?format=js" + voteData,
    error: function() {
      $(that).toggleClass("status-3");
    },
    beforeSend: function() { 
      $(that).toggleClass("status-3");
    }
  });

  return false;
});

这是因为jQuery调用了你的错误和beforeSend函数：userfunction.apply( xhr[, args] );，这使得this关键字引用了XHR。

jQuery选择器$（this）没有按预期工作

2 个答案: