如何找出对象的onclick事件调用的javascript函数？

Question

如何找出对象的onclick事件调用的javascript函数？ 更好的是，我可以找出哪个函数包含的.js文件？

Answer 1

我使用Chrome的开发人员工具：

选中click框，然后单击要查找其处理程序的页面上的元素。 如果您使用的是jQuery（或类似的库），则可能需要在访问代码之前逐步执行它们。

Answer 2

你可以这样做

在JsFiddle上使用Javascript 演示

div1 = document.getElementById('div1');

alert(div1.getAttribute("onclick"));​

在JsFiddle上使用jQuery Demo

<div id="div1" onclick="myfun();" >​

alert($('#div1').attr('onclick'))​;

Answer 3

您将无法找到调用onclick事件的文件，但myObject.onclick将为您提供正在调用的函数。 不，你不需要jQuery。

获取函数的名称 ，这有点复杂。 您可以尝试这样的事情，也许：

var myFunc = myObject.onclick, myFuncName = "";

for(prop in window) {
    if(window.hasOwnProperty(prop) && window[prop] === myFunc) {
        myFuncName = prop; // myFuncName is now the name of the function. This only works if you didn't assign an anonymous function to the click handler.
        break;
    }
}

但老实说，我认为这有点过分。

Answer 4

这取决于event的附加方式。

如果你没有像jQuery那样绑定onclick你可以这样做：

var obj = document.getElementById('elementId');
console.log(obj.onclick);

Answer 5

我这样做是使用这个Visual Event脚本，它整齐地突出显示哪些事件由哪些元素的哪些函数订阅。

要查找代码的源代码，只需使用FireBug或类似的浏览器开发人员工具来搜索函数名称。

Answer 6

我有一个不同的方法。 我重载onclick函数并在真正的函数之前添加我的调试器。

这是元素

<div id="div1">​

将此JavaScript写入开发人员控制台

var clickFn = $("#div1").click; 

$("#div1").click(function(){ 
    debugger; 
    clickFn(); 
});