你怎么能找到＆＃34; onevent＆＃34; HTML中的处理程序，没有事件监听器面板？

Question

我正在看一个以老式的方式添加了几个事件处理程序的元素 -

<input onblur="doSomething()" onkeyup="doSomethingElse()">

当我在检查器中检查事件侦听器面板时，它完全是空的。

有没有办法在页面的源代码中找到这些代码，除了手动ctrl + f＆＃39的函数名称？

Answer 1

您可以在控制台中使用toString方法：

doSomething.toString()

或者您可以通过调试器找到它：

function findMyCode(element){
    debugger
    element.onblur.call(element);
}
findMyCode(document.getElementById('idOfYourInput'));

然后进入函数调用。

Answer 2

此问题已在Chrome 70中修复。这是Chrome DevTools的屏幕截图，其中显示了所选输入元素的已注册事件处理程序，

要找到这些功能的源代码，只需在控制台中复制粘贴该功能名称，然后按Enter键即可获取这些功能的源代码。

或者，您可以通过按Ctrl + Shift + F进行快速搜索，这将打开搜索面板。现在，选中正则表达式框并键入“ function \ s * doSomething \ s * \（”，然后按Enter。这将直接带您到函数定义。