Finding bounded events in inspector

问题

I've been wondering a long time about this. Is there a way in eg Chrome to see what events are bound to an element? Since many people now use jQuery with a syntax like the following:

$("a.subtle").click(function(){
    //do something
});

Is there a way in the inspector to easily find this code? I know in the inspector you can go to the "event listeners"-tab to see what events are bound. Looking at an example I can see there is a click-event on the element with the js file of jQuery next to it, so this must somehow point to it, but of course it is obscured by all the jQuery code. Here's what I'm looking at:

So the question is, is there a quick way to find the jQuery code applied to an element? To be clear, I want to quickly find the code I posted up top.

I could search through the source code for a .click() on that class, but of course it could be done via its parent, or with .on(), or on so many bazillion ways..

回答1:

Check out the Visual Event bookmarklet.

---

Here's a quote from their website:

Visual Event is an open source Javascript bookmarklet which provides debugging information about events that have been attached to DOM elements.

Visual Event shows:

• Which elements have events attached to them.
• The type of events attached to an element.
• The code that will be run with [sic] the event is triggered.
• The source file and line number for where the attached function was defined (Webkit browsers and Opera only).

来源：https://stackoverflow.com/questions/18561546/finding-bounded-events-in-inspector