用户事件的Javascript断点

时间:2012-06-21 16:00:00

标签: javascript google-chrome script-debugging

当我点击我的应用程序中的一个按钮时,会执行一系列Javascript代码,在这种特殊情况下,我点击“取消”按钮关闭当前打开的模态窗口。这个close按钮在HTML上显示如下:

<a class="cancel close">Cancel</a>

我需要的是一种跟踪Javascript中单击此<a>元素的操作“触发”的方法,而不必查看.js文件以获取对此DOM元素的引用(事件所在的位置)绑定到<a>元素。

有没有办法在用户生成事件后在Javascript中创建某种断点,但我不知道Javascript代码在哪里?为了真正找到该代码的位置。

我正在使用Google Chrome /开发者工具来调试Javascript。

2 个答案:

答案 0 :(得分:3)

打开开发者控制台;切换到脚本选项卡;单击左侧边距(在行号上)以设置断点。脚本的执行将在断点处暂停,您可以检查调用堆栈,局部变量等。

或者,您可以在触发事件之前单击“暂停”,脚本执行将在脚本即将执行时暂停(如设置全局断点),并显示代码。然后你可以恢复,跳过,步入或退出当前的函数/表达式。

你可以在Firebug和Safari,Chrome,Opera和IE中的内置控制台中实现这一点。

编辑:我应该补充一点,如果你有javascript驱动的动画,ajax轮询或其他代码被调用间隔,暂停按钮就不那么有用,因为暂停按钮会停止任何脚本执行直到您单击resume。因此,当你有机会触发你感兴趣的代码之前,可能会停止调用动画的更新函数。

但是,在大多数(如果不是全部)开发人员控制台中,还有“Break on exceptions”和“Break on uncaught exception”选项。就像暂停按钮一样,它就像有一个全局断点,除了它只在遇到麻烦时停止。因此,如果您尝试查找的代码导致错误或抛出异常,则可以将调试器设置为在发生这种情况时暂停脚本。

答案 1 :(得分:0)