输入输入X秒钟后更改背景颜色

Question

我有一个contenteditable div，当您键入它时，两秒钟后，我尝试更改其背景颜色。

这是我的代码：

function changeFn(){
      $(this).css('background','red')
      console.log($(this).attr('id'));
   } 
var timer;

    $("div.content").on("keypress paste", function () { 

        clearTimeout(timer);
          timer = setTimeout(changeFn, 2000)
    });

似乎我必须将$（this）传递给函数，因为它无法识别哪个$ this。

当我在按键功能中设置背景颜色更改时，它会起作用。

jsFiddle： http : //jsfiddle.net/uc8Tg/

Answer 1

使用jQuery.proxy ，它设置函数的上下文：

function changeFn() {
    $(this).css('background', 'red');
}
var timer;

$("div.content").on("keypress paste", function() {

    clearTimeout(timer);
    timer = setTimeout($.proxy(changeFn, this), 2000);
});

示例： http ： //jsfiddle.net/uc8Tg/1/

Answer 2

function changeFn(){
    $(this).css('background','red')
    console.log($(this).attr('id'));
} 
var timer;
$("div.content").on("keypress paste", function () { 
    clearTimeout(timer);
    var self = this;
    timer = setTimeout(function(){changeFn.call(self)}, 2000)
});

https://developer.mozilla.org/zh-CN/JavaScript/Reference/Global_Objects/Function/call