找到在Web浏览器中触发然后事件的jQuery代码

Question

我加入了一个团队来完成一个项目。现在他们使用jQuery并且很多javascript文件都是外部文件而不是嵌入式文件。

当我点击一个按钮时，它看起来像：

<a class="button_cancel">Cancel</a>

它会触发一个javascript文件中定义的事件。

触发onclick时，是否有办法找到文件（甚至文件的确切行）？

Answer 1

您可以使用一些开发人员工具，例如Firefox的Firebug扩展（我希望您已经拥有）。在Firebug的“脚本”面板中，您可以设置“Break on next”（在左上角），这实际上意味着，在接下来执行的任何一行中设置一个断点。激活它。然后单击按钮。你应该登陆执行的文件。如果没有逐步完成代码，你就会到达那里。 唯一令人讨厌的事情是，如果还有其他一些JavaScript在不断运行。

我相信Chrome，Safari和Opera的开发者工具提供了类似的功能。

编辑： Chrome也有。面板“Sources”位于右上角，它被称为“Pause Script Execution”。

Answer 2

Visual Event 2可以以一种简单易用的方式为您提供这些信息。

  

Visual Event是一个开源的Javascript书签，提供   调试有关已附加到DOM的事件的信息   元素。视觉事件显示：

     

  
• 哪些元素附加了事件
  
• 附加到元素的事件类型
  
• 将触发将与该事件一起运行的代码
  
• 定义附加功能的源文件和行号（Webkit浏览器和仅限Opera）
  

Demo