Как получить текущий HTML-элемент, на который вызывается обработчик события

Question

Как получить ссылку на элемент HTML DOM внутри своего обработчика событий, который я подключаю?

var dashboard = 
    { 
     WireHandlers : function() 
     { 
      $(".approveButton") 
      .unbind("click") 
      .click(dashboard.approve) 
     }, 

     approve : function() 
     { 
      // In here, I would like a reference 
      // to the HTML DOM element that was clicked 

      // Also, I would like its id 
     } 
    } 

Answer 1

Просто добавьте аргумент в вашей approve функции (обычно с именем event) и называют currentTarget на нем:

approve : function(event) { 
    // In here, I would like a reference 
    // to the HTML DOM element that was clicked 
    event.currentTarget 

    // Also, I would like its id 
    event.currentTarget.id 
} 

Обратите внимание, что вы можете также использовать this в методе approve ссылаться на щелкнул элемент.

approve : function() { 
    this // or $(this) if you want to use jQuery 
} 

---

Обратите внимание, что в этом случае target и currentTarget являются взаимозаменяемыми. Однако в более сложных сценариях, there are important differences between the two.

Answer 2

$(this) 

является JQuery элемент (this является элементом DOM)

this не будет привязан к dashboard (как вы только обеспечивая функцию обратного вызова, вы должны будете использовать, например, dashboard.WireHandlers)

Answer 3

Из Jquery документации здесь: https://api.jquery.com/click/

вы можете получить доступ к действовал на элемент через «это» VARI Уметь:

approve : function() 
     { 
      var elem = this; 
      var id = elem.id; 
     }