Question

这是我需要学习一段时间的东西，我想知道是否有任何javascript专家可以指出我正确的方向。

我使用的许多库似乎都接受函数指针作为参数，例如成功，失败等钩子。以下是我正在处理的应用程序中的一个简单示例：

$('.clock-btn').each(function(){
$(this).click(function(){
    $.ajax(
        {
            url:'punch.php?task_id=' + $(this).data('task-id'),
            success: function() {
                reverseCSS($(this));
            },
            error: function() {
                window.alert("Clocking time to this project is not allowed.");
            }
        }
    );
});

}）;

reverseCSS()函数是一个将按钮更改为动画的函数，并根据之前的内容用'clock-in / clock-out'交换单词。

但是，我无法访问$.ajax调用中的$（this）变量。这是我的预期行为，正如我在本例中所知，$(this)将是$.ajax object，而不是我需要的项目。

那么，访问$(this)项目的最佳方法是什么？

非常感谢你的帮助。

Answer 1

这是bind()函数的作用：

$('.clock-btn').each(function(){
$(this).click(function(){
    $.ajax(
        {
            url:'punch.php?task_id=' + $(this).data('task-id'),
            success: function() {
                reverseCSS($(this));
            }.bind(this)
        }
    );
});

它只返回一个总是在你给它的上下文中运行的函数，在这种情况下上下文是this

Answer 2

有些事情：

$(this).click(function() {
  var $self = $(this);

  $.ajax({
    url:'punch.php?task_id=' + $(this).data('task-id'),
      success: function() {
        reverseCSS($self);
      },

      // ...

Answer 3

$('.clock-btn').each(function(){
    $(this).click(function(){
        var that = this; // save it to another variable
        $.ajax({
            url:'punch.php?task_id=' + $(this).data('task-id'),
            success: function() {
                reverseCSS($(that));
            },
            error: function() {
                window.alert("Clocking time to this project is not allowed.");
            }
        });
    });
});

将变量传递给匿名函数

3 个答案: