如何获取在触发事件时执行的JavaScript文件列表?

时间:2017-02-06 10:14:35

标签: javascript file events knockout.js google-chrome-devtools

在复杂的系统中,如何获取在按钮点击或点击输入字段期间触发的所有JavaScript文件的列表?

我可以使用chrome dev-tools来完成它还是有其他解决方案吗?如果我能用chrome dev-tools做到那么怎么办?

我面临的问题:我试图在按钮点击重定向到另一个页面之前找到包含我可以截取的方法的文件以添加我的自定义验证?文件名对我很有用,因为系统遵循干净的代码规则。

更新 我发现this tutorial,但提供的解决方案似乎都没有用(我确信断点不起作用)。 @Carles Alcove在推荐帖子中建议的Visual Event扩展程序会将我引导至knockout.js文件。在该文件中,我添加了console.trace()函数(第二张图像是结果),如@ guest271314所示。第一张图片是我用@ user3297291

建议的dev-tools检查按钮的时候

enter image description here enter image description here

2 个答案:

答案 0 :(得分:1)

您可以在console.trace()事件处理程序中添加console.profile()console.profileEnd()click,查看consoleProfiles标签中的文件行数在DevTools

答案 1 :(得分:0)

您可以通过执行以下操作检查附加到开发人员工具中元素的事件侦听器的概述:

  • 元素上的鼠标右键
  • 在上下文菜单中检查元素
  • 点击开发者右侧面板中的事件监听器标签。工具
  • 检查mouseupclick个事件。

enter image description here

您将看到附加的方法及其文件名。我不确定这是否适用于各种事件监听器(例如,如果事件绑定到父元素),但它可以快速预测可能被调用的内容。