javascript - jQuery淡出回调错误

Question

Firebug 表明我有TypeError: a.ownerDocument is undefined这个代码：

$(this).text('Updated!').fadeOut('900',  function() { 
  $(this).text('Update').attr('disabled', 'disabled').show()
});

更完整的片段如下：

$(".update-role").click(function() {
  var newRole = $(this).prev().val();
  var userId  = $(this).parents('tr').attr('id');  // e.g. 'user-role-18'
  userId = userId.split('-');
  userId = userId[2]; // so we get '18'
  $.getJSON('services/update_staff_role.php', {r: newRole, id: userId}, function(j) {
    if(j.result == 'success') {
    $(this).text('Updated!').fadeOut('900',  function() { 
          $(this).text('Update').attr('disabled', 'disabled').show()
        });
    } else {
      alert(j.reason);
    }
  });
  console.info(userId, newRole);
});

可能是因为我正在使用this，因为我正在使用callback另一个内部callback？

Answer 1

添加var _this = $(this);then 而不是$(this).text..use _this.text...，因为$(this)参考$.getJSON：

$(".update-role").click(function() {
  var _this = $(this);
  var newRole = $(this).prev().val();
  var userId  = $(this).parents('tr').attr('id');
  userId = userId.split('-');
  userId = userId[2];
  $.getJSON('services/update_staff_role.php', {r: newRole, id: userId}, function(j) {
    if(j.result == 'success') {
    _this.text('Updated!').fadeOut('900',  function() { 
          $(this).text('Update').attr('disabled', 'disabled').show()
        });
    } else {
      alert(j.reason);
    }
  });
  console.info(userId, newRole);
});

Answer 2

是的this，当在回调中时，不是指被点击的按钮。在调用 $.getJSON 之前，您可以将按钮引用存储在变量中，然后在回调中访问该变量。