javascript - 如何让 jquery 找到该行并在成功时触发一个 Action (使用 "this")

Question

这是一个 jquery 代码，当用户修改单元格时执行数据库更新:

$( document ).ready(function() {
    $('tr').on('blur', 'td[contenteditable]', function() {
        $.post("ajax/modQtyModels", {
            modelId: $(this).closest('tr').children('td.idmodel').text(),
            qty: $(this).closest('tr').children('td.editQty').text(),
            ajax: true,
            success: function(data) {
                $(this).closest('tr').children('td.editQty').addClass("success");
            }
       });
    });
});

在“成功”部分，我希望它只更改该单元格的类(在使用 Bootstrap 时更改其颜色)以向用户显示他们的数据已成功更改，但它似乎没有注意到它已经改变颜色。我已经尝试了那条线上的所有内容，但我想这条线不是问题所在。警报等其他操作效果很好，所以我怀疑 $(this)。

Answer 1

在 success 回调中，您正在处理另一个 function，因此 scope 不再是您的 blur 事件 callback，因此 this 关键字将指向另一个 object 而不是您的 jQuery 元素。

因此您需要将 this 值保存在另一个 variable 中，并在 success 回调中使用此 neww 变量引用您的元素。

(document).ready(function() {
  $('tr').on('blur', 'td[contenteditable]', function() {
    var tr = $(this);
    $.post("ajax/modQtyModels", {
      modelId: $(this).closest('tr').children('td.idmodel').text(),
      qty: $(this).closest('tr').children('td.editQty').text(),
      ajax: true,
      success: function(data) {
        tr.closest('tr').children('td.editQty').addClass("success");
      }
    });
  });
});