Jquery get the actual control that fired the event.

Question

I have a following html:-

<button type="button" class="btn-add">
  <i class="some-icon"></i>
</button>

which creates a nice fancy button with an icon

I bound an event on the button click:-

function (e) {
  console.log($(e.target));
}

now when i click on the center of the button the output of the above javascript is <i> element because of e.target. Is there any other way to get the actual control that fired this event, in this case the <button> ?

Please show us the code that installed the event handler. `this` inside the event handler should be the object that the event was bound to. — jfriend00, Mar 19 '13 at 06:18

score 3 · Accepted Answer · edited May 23 '17 at 11:45

3

Read this Difference between target and currentTarget

Here is your solution: Fiddle link

$('.btn-add').click(function(e) {
    alert(e.currentTarget.tagName);
});

edited May 23 '17 at 11:45

Community

1
1

answered Mar 19 '13 at 06:22

Sachin Jain

21,353
33
103
168

score 1 · Answer 2 · answered Mar 19 '13 at 06:35

1

You can use either this or e.currentTarget

$('button').click(function(e){
    console.log(e.target);
    console.log(this);
    console.log(e.currentTarget);
})

Demo: Fiddle

answered Mar 19 '13 at 06:35

Arun P Johny

384,651
66
527
531

Jquery get the actual control that fired the event.

2 Answers2