Question

我有一个元素的点击事件。我在延迟后执行代码。所以我在点击事件中使用了settimeout。

我的HTML：

<button id="button">CLICK ME</button>

我的js：

jQuery('#button').on('click',function(){
  setTimeout(function(){
    console.log(this);
  },50)
});

我想在this函数内更改setTimeout 我知道的一个解决方案是创建一个命名函数，然后使用bind。

   var test = function(){
        console.log(this);
    }
    jQuery('#button').on('click', function () {
      setTimeout(test.bind(this),10);

    });

我不想每次都使用命名函数。
那么如何将this与匿名函数绑定？
这是codepen可以使用的。

Answer 1

只需将其保存到另一个范围在setTimeout之外的变量。

jQuery('#button').on('click',function(){
  var $this = this;
  setTimeout(function(){
    console.log($this);
  },50)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="button">Click Me</button>

Answer 2

您也可以.bind()使用匿名功能。

jQuery('#button').on('click',function(){
  setTimeout((function(){
    console.log(this);
  }).bind(this),50)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="button">Click Me</button>

Answer 3

您不想使用已命名的功能。

jQuery('#button').on('click', function () {
    setTimeout((function(){
        console.log(this);
    }).bind(this),10);
});

传递匿名函数时如何在setTimeout中更改此/ context？

3 个答案: