如何调试JAVASCRIPT事件？或者如何使所有函数调用跟踪？ [英] How to debug JAVASCRIPT events? Or how to make all functions call trace?

问题描述

例如，有一个按钮。它被< div> 包裹。

当按下此按钮时，会发生javascript函数调用，然后另一个函数，然后通过ajax调用到服务器，如果可以的话，javascript将该页面重定向到另一个页面。

很难调试。

是否可以捕获此事件？即知道，点击按钮后调用什么功能？按钮没有属性onclick，即事件监听器在javascript中连接。

如果不可能，那么可能进行跟踪？那就是看所有的函数调用，之后调用？

在视觉上会更好，虽然在文本中也是很好：）

感谢您的回复！

解决方案

是的 - 这种事情不是那么简单你想要的。

Google Chrome有一个事件侦听器面板。右键单击您的按钮，然后选择检查元素。确保选择了正确的元素，然后选中右侧的事件监听器面板。

您还可以使用debugger关键字设置断点callstack在某处然后使用您最喜爱的JavaScript调试器（Safari中的内置开发工具，Google Chrome和IE8，Firefox的firebug）。在每一个中，都有一个调用堆栈，允许您浏览当前的调用堆栈。

For example there is a button. It is wrapped by <div>.

When pressing to this button, there is javascript function call happen, then another function, then calling by ajax to the server and if it's OK, javascript redirecting this page to another page.

It's hard to debug.

Is it possible to "catch" this event? I.e. to know, what function is called after the click on the button? Button doesn't have attribute "onclick" i.e. event listener is connected in javascript.

And if it's not possible then is it possible to make trace? That is to look at all functions calls, which is called after which?

It would be better in visual way, though in textual is also good:)

Thanks for replies!

解决方案

Yeah - this sort of thing is not as simple is you would like.

Google Chrome has an "Event Listeners" panel. Right-click your button, then select "Inspect Element". Make sure the correct element is selected, then check the "Event Listeners" panel on the right.

You can also use the "debugger" keyword to set a breakpoint in the callstack somewhere. Then use your favorite javascript debugger (built-in dev tools in Safari, Google Chrome & IE8, firebug for Firefox). In each of these, there's a call stack that'll allow you to navigate through the current call stack.

这篇关于如何调试JAVASCRIPT事件？或者如何使所有函数调用跟踪？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！