Изменить цвет фона после X секунд при вводе ввода

Question

У меня есть div contenteditable, и когда вы вводите его, через 2 секунды я пытаюсь изменить его цвет фона.

Это мой код:

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) 
    }); 

Кажется, что я должен передать $ (это) к функции, потому что она не распознанные $ это.

Когда я устанавливаю изменение цвета фона внутри функции нажатия клавиши, он работает.

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/en/JavaScript/Reference/Global_Objects/Function/call