связанные с jQuery обработчики событий

Question

Я хочу прикрепить обработчик события 'click' к первому дочернему элементу с идентификатором 'foo', используя jQuery . Я понимаю, что синтаксис для этого:

$('#foo:first-child').bind('click', function(event) {
    // I want to access the first child here
})

Внутри тела обработчика я хочу получить доступ к элементу, который вызвал событие. Я где-то читал, что вы не можете просто обратиться к нему через «это», так как я могу получить к нему доступ?

Answer 1

Просто чтобы добавить к ответ Грега , есть одно маленькое исправление:

 this === $('#foo:first-child') // returns false
 $(this) === $('#foo:first-child') // returns true

this ссылается на сам элемент HTML, а $(this) просто превращает его в элемент jQuery.

Answer 2

Забудьте, что вы где-то читаете, и используйте это ключевое слово:

$("#foo:first-child").click(function(event) {
  $(this).css("background", "pink");
});

Answer 3

$(this).doStuff()

Answer 4

Просто используйте «это»:

$('#foo:first-child').bind('click', function(event) {
  alert(this === $('#foo:first-child')); // True
  this.style.color = "red"; // First child now has red text.
})