3

我正在尝试调试我没有编写的网页。有一个按钮在我单击它时运行 JavaScript 命令，但我无法弄清楚包含 .onClick 或 .click 命令的 JavaScript 代码在哪里，该命令将该函数分配给 click 事件。这是按钮的代码：

<li><a href="#top" class="page-link btn-custom btn-sign-up-bottom"></a></li>

我知道我可以使用 Chrome 开发工具并查看元素选项卡->事件侦听器->单击以显示单击它时运行的函数，但我想找到设置侦听器的代码行。这很棘手，因为可以使用按钮所属的三个类中的任何一个来分配侦听器，或者可能是所有链接都被分配了这个 onClick。我怀疑我必须经常这样做，所以我希望有一个有效的解决方案。

4

2 回答 2

0

我不知道如何找到该行，但是通过以下代码您可以找到哪个函数添加了事件。

首先给元素添加一个id，比如myid

在元素之后添加此脚本：

var el=document.getElementById('myid');
el.oldAddEvent=el.addEventListener;
el.addEventListener=function f(a,b,c){
    if(a=='click'){
        alert((f.caller?f.caller+"\n\n":"Window ")+"has added a click event to\n\n"+b+"\n\nwith eventCapture="+(c?true:false));
    }
    el.oldAddEvent(a,b,c);
}

那么，如果有这样的脚本......

<script>
el.addEventListener('click',f,false);
</script>

...它会提醒

Window has added a click event to

function f() {
    alert("click");
}

with eventCapture=false

有了这个...

function g(){
el.addEventListener('click',f,false);
}
g();

...它会提醒

function g() {
    el.addEventListener("click", f, false);
}

has added a click event to

function f() {
    alert("click");
}

with eventCapture=false
于 2012-08-18T23:03:51.850 回答
0

也许您可以像这样使用 chrome 控制台附加 onclick 处理程序并调用调试器

$('.btn-sign-up-bottom').click(function(){
   debugger;
});

Javascript 执行将中断，然后您可以继续按 F10 或 F11 来单步.. 看看它是如何进行的.. 也许您将单步执行原始事件处理函数！

于 2012-08-18T22:17:30.390 回答