使用Chrome，如何查找绑定到元素的事件

Question

假设我的页面上有一个链接：

<a href="#" id="foo">Click Here</a>

我什么都不知道，但是当我单击链接时，alert("bar")会显示一个。所以我知道某个地方已经绑定了一些代码#foo。

如何找到alert("bar")将click事件绑定到的代码？我正在寻找Chrome的解决方案。

附注：这个例子是虚构的，所以我不是在寻找类似的解决方案：“使用XXXXXX并在整个项目中搜索“ alert（\“ bar \”）”。我想要一个真正的调试/跟踪解决方案。

Answer 1

使用Chrome 15.0.865.0 dev。“元素”面板上有一个“事件侦听器”部分：在“脚本”面板上还有一个“事件侦听器断点”。使用鼠标->单击断点，然后“进入下一个函数调用”，同时密切注意调用堆栈，以查看哪个userland函数处理该事件。理想情况下，你会用unminified一个替代的jQuery缩小的版本，这样你就不必介入所有的时间，并使用步骤在可能的情况下。