debugging - 如何使用 Firebug（或类似的东西）检查事件流？

Question

我面临输入失去焦点的问题。问题是这样的：

1. 我发送一个 AJAX 请求来加载表单，加载时我以模式显示它。

2. 现在，如果我单击任何输入，它会立即获得焦点并模糊，所以我需要再次单击它（这次它保持焦点）。

我需要一个在 Firebug 的控制台（或一些类似工具）中跟踪事件流和调度的工具，以便我可以检测到这种奇怪行为的罪魁祸首并修复它。

我尝试过 Eventbug 和 FireQuery；但我无法找到导致此问题的代码。

Answer 1

您可以转到 Firebug 的脚本面板，然后将鼠标悬停在输入上，然后ALTCTRLB从键盘单击以激活“Break on next”，然后单击输入，它应该在输入的 onclick 处理程序中命中一个断点，然后您可以通过代码查找导致模糊的潜在调用（前提是由于某种原因您没有通过setInterval/setTimeout在您的 javascript 中进行任何激进的轮询，或者您使用的框架没有；那么它可能会暂停代码）。

您可能还想在页面的最开头执行一些代码来覆盖该addEventListener方法，以便您劫持它：记录对它的任何调用，并将执行转发到原始函数；请参阅我的演示文稿的幻灯片 13-14 （我在 Greasemonkey 中进行，但在这里不相关；只需确保在页面的最开头执行此操作）。