gpt4 book ai didi

javascript - 如何使用 Firebug 或类似工具调试 JavaScript/jQuery 事件绑定(bind)?

转载 作者:可可西里 更新时间:2023-11-01 02:48:57 25 4
gpt4 key购买 nike

我需要调试一个使用 jQuery 来做一些相当复杂和困惑的 Web 应用程序 DOM操纵。有一次,一些绑定(bind)到特定元素的事件没有被触发,只是停止工作。

如果我有能力编辑应用程序源代码,我会向下钻取并添加一堆 Firebug console.log() 语句和注释/取消注释代码片段以尝试查明问题。但假设我无法编辑应用程序代码,需要使用 Firebug 或类似工具完全在 Firefox 中工作。

Firebug 非常擅长让我导航和操作 DOM。不过,到目前为止,我还没有弄清楚如何使用 Firebug 进行事件调试。具体来说,我只想查看在给定时间绑定(bind)到特定元素的事件处理程序列表(使用 Firebug JavaScript 断点来跟踪更改)。但是要么 Firebug 没有查看绑定(bind)事件的能力,要么我太笨找不到它。 :-)

有什么建议或想法吗?理想情况下,我只想查看和编辑绑定(bind)到元素的事件,类似于我现在编辑 DOM 的方式。

最佳答案

参见 How to find event listeners on a DOM node .

简而言之,假设在某个时刻将事件处理程序附加到您的元素(例如):$('#foo').click(function() { console.log('clicked!') } );

你像这样检查它:

  • jQuery 1.3.x

    var clickEvents = $('#foo').data("events").click;
    jQuery.each(clickEvents, function(key, value) {
    console.log(value) // prints "function() { console.log('clicked!') }"
    })
  • jQuery 1.4.x

    var clickEvents = $('#foo').data("events").click;
    jQuery.each(clickEvents, function(key, handlerObj) {
    console.log(handlerObj.handler) // prints "function() { console.log('clicked!') }"
    })

参见 jQuery.fn.data (jQuery 在内部存储您的处理程序的位置)。

  • jQuery 1.8.x

    var clickEvents = $._data($('#foo')[0], "events").click;
    jQuery.each(clickEvents, function(key, handlerObj) {
    console.log(handlerObj.handler) // prints "function() { console.log('clicked!') }"
    })

关于javascript - 如何使用 Firebug 或类似工具调试 JavaScript/jQuery 事件绑定(bind)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/679994/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com