Is there a way to figure out this from a jQuery click event?

Question

is there some equivalent of this that can be derived from e.target

e.target can be a child of this.

you could do $(e.target).closest("a") if you know what the selector is for the element that the click function is bound to.

But, what if you don't know the selector?

EDIT: for clarification:

I'm experiencing a TypeError: Cannot call method 'createDocumentFragment' of undefined error when I try to test a click function.

I have bound a click function to an element like so: $(".original_list_trigger").click(Helpers.originalTextButtonClick);

and that is defined like this:

Helpers: {
        originalTextButtonClick: function(e) {
            var self = $(this);
            console.log(self);
...
}...}

console.log(self) doesn't give an element, but the function itself, which isn't what I want. $(this) should be the element that has the function bound to the click event, right?

This is $(this): enter image description here so, it looks like $(this), is the object Helpers... :-\

UPDATE:

Basically, I'm dumb. the problem was being caused by this being invoked:

Helpers.originalTextButtonClick(); <- I wasn't passing anything as e, so.. of course e.anything wouldn't be defined.

Since I'm running tests through Jasmine, http://pivotal.github.io/jasmine/, I need to find a way to mock the event object, and this. Or I could just trigger a click on the element (which I'll probably do, since that's easier)

Have you logged out the **event** object? I'm sure you can find what you're looking for :) — pmandell, Jul 15 '13 at 14:15
Put `console.log(e);` in your code and then have a look for what you need in the console. Alternatively, show us the code you have and tell us what you want to get from it. — Reinstate Monica Cellio, Jul 15 '13 at 14:16
may be this what you looking for, how to detect if elem has onclick event? http://stackoverflow.com/questions/1515069/jquery-check-if-event-exists-on-element — Alex Kneller, Jul 15 '13 at 14:23
Are you saying you're now doing something like this : $(".original_list_trigger").click(Helpers.originalTextButtonClick(someObject)) ? If so, that's not what you want to do. That is actually passing the return value of the function as the callback, not the reference to the function you want to call. $().click() accepts a callback function that will execute when the event is triggered. jQuery normalizes and enhances the event object across browsers and then passes it as the first argument to the callback function. You don't/can't manually pass anything into the callback. — roblarsen, Jul 15 '13 at 15:30
well, I wouldn't be passing just any object, I'd need to pass an event object, right? Also, I ended up just calling .click(), and then testing the results of the bound function. Not as separate as I want, but it'll have to work, since my function uses `this` — NullVoxPopuli, Jul 15 '13 at 16:52

Eric Frick · Accepted Answer · 2013-07-15T14:31:09.733

2

Take a look at the currentTarget prop

  $("p").click(function(event) {
      alert( event.currentTarget === this ); // true
    });

JQuery event.currentTarget

after edits:

originalTextButtonClick: function(e) { var self = $(e.currentTarget); console.log(self); ... }

edited Jul 15 '13 at 14:31

answered Jul 15 '13 at 14:17

Eric Frick

847
1
7
18

I added some clarification – NullVoxPopuli Jul 15 '13 at 14:27
I see. What if you log the e.currentTarget ? Is that what you expect ? – Eric Frick Jul 15 '13 at 14:29
`TypeError: Cannot read property 'currentTarget' of undefined` nope. lol – NullVoxPopuli Jul 15 '13 at 14:30
does `e` not get passed along when you bind functions to a click? I thought that was supposed to work like that o.o – NullVoxPopuli Jul 15 '13 at 14:32
aren't you receiving a totally empty e parameter ? – Eric Frick Jul 15 '13 at 14:34
I found the problem... I feel really dumb now >_< Helpers.originalTextButtonClick(); <- causing the error. – NullVoxPopuli Jul 15 '13 at 14:36
what do you mean? clarify! I'm curious now :P – Eric Frick Jul 15 '13 at 14:38
Oh I see now. You were calling the function manually, not by attaching it to a event, right? – Eric Frick Jul 15 '13 at 14:47
yup. silly me. sometimes I wish javascript had stricter exceptions on how many parameters are required for functions. :-\ – NullVoxPopuli Jul 15 '13 at 14:49
yep, that's the core of javascript programming anyway! glad you fixed it. – Eric Frick Jul 15 '13 at 14:50

Luca Fagioli · Answer 2 · 2013-07-15T14:34:25.587

0

This should work:

Helpers: {
        originalTextButtonClick: function(e) {
            var closestAnchorElement = $(e.currentTarget).closest("a");
...
}...}

edited Jul 15 '13 at 14:34

answered Jul 15 '13 at 14:21

Luca Fagioli

12,722
5
59
57

I added some clarification – NullVoxPopuli Jul 15 '13 at 14:28
1

Please check if this suits your requirements. – Luca Fagioli Jul 15 '13 at 14:35
this will come in handy for when I actually need to do this. Turns out the problem was because I had something manually calling the click event, so e isn't going to be defined. `Helpers.originalTextButtonClick();` <- I wasn't passing anything as e – NullVoxPopuli Jul 15 '13 at 14:38

score 0 · Answer 3 · answered Jul 15 '13 at 14:40

0

We can use -

$("p").click(function(event) {
    alert(event.toElement); 
});

Try This

answered Jul 15 '13 at 14:40

Ishan Jain

8,063
9
48
75

a little modification: http://jsfiddle.net/vA693/1/ if you click the text, it doesn't return the id. which, is what my original question would want it to do. – NullVoxPopuli Jul 15 '13 at 14:45

Is there a way to figure out this from a jQuery click event?

3 Answers3