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

2024-04-23

我需要调试一个使用 jQuery 执行一些相当复杂和混乱的 Web 应用程序DOM http://en.wikipedia.org/wiki/Document_Object_Model操纵。在某一时刻,一些绑定到特定元素的事件不会被触发,而是停止工作。

如果我有能力编辑应用程序源代码,我会深入研究并添加一堆Firebug http://en.wikipedia.org/wiki/Firebug_%28software%29 console.log()语句并注释/取消注释代码片段以尝试查明问题。但假设我无法编辑应用程序代码,需要使用 Firebug 或类似工具完全在 Firefox 中工作。

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

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


See 如何在 DOM 节点上查找事件侦听器 https://stackoverflow.com/questions/446892/how-to-find-event-listeners-on-a-dom-node/447106#447106.

简而言之,假设在某个时刻有一个事件处理程序附加到您的元素(例如):$('#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!') }"
    })
    

See jQuery.fn.data http://docs.jquery.com/Core/data#name(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!') }"
    })
    
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 Firebug 或类似工具调试 JavaScript / jQuery 事件绑定? 的相关文章

  • 静态方法而不是原型方法Javascript

    当在类中调用实例函数时 对象的每个实例都会获得自己的函数副本 但在原型方法和静态方法中不会创建副本 它们属于类 所以如果它们都没有创建其函数的副本 那么为什么如果我们不想复制 可以简单地使用原型方法 那么我们是否有静态函数 我有点困惑 如果
  • html画布绘图显示出来

    我确信这个问题在我还找不到答案之前就已经被问过 我想通过在顶部绘制另一个白色矩形来擦除黑色矩形的一部分 但是许多原始黑色矩形显示出来 就像正在平均一样 canvas document getElementById canvas contex
  • FindAndUpdate 如何检查文档是否真的更新

    想象一下以下模型 var Office id 1 name My Office branches adddress Some street that avenue isPrincipal true adddress Another addr
  • 使用Puppeteer拦截请求时如何获取原始编码响应大小?

    我使用此代码来记录在 Chrome 中加载页面时编码的响应大小 const puppeteer require puppeteer async function const browser await puppeteer launch co
  • 锁定 contenteditable="true" div 中的元素

    我有一个用于用户输入的 contenteditable div 当单击按钮时 它会显示替换某些单词的选项 首先 它删除所有 html 并创建可以替换单词的 span 元素 这些词的标记不同 我面临一些问题 当直接在跨度之前或之后单击并键入文
  • jQuery Mobile 和页眉/页脚问题

    使用 jQuery Mobile 有人知道为什么当使用 changePage 函数更改到内容超出视口高度的页面时 页面的页眉会消失而页脚会出现在内容顶部的视图中吗 仅当您使用过渡来更改页面时才会发生这种情况 如果您在没有过渡的情况下更改页面
  • JavaScript 动态变量名称[重复]

    这个问题在这里已经有答案了 好吧 我想在用户单击时创建变量 每次单击都会添加一个新变量 我目前正在使用 jquery 和 javascript 我无法在服务器端执行此操作 这必须在浏览器中完成 newCount document getEl
  • window.print() 仅打印屏幕的“可视”部分

    我有一个可滚动屏幕 上面有一个打印按钮 并且在其 onclick 事件上调用 window print 函数 我的问题是它只打印屏幕的 可见 部分 而不是整个屏幕 如果页面可滚动 则当内容无法容纳在 1 页中时 打印应扩展到 2 或更多 页
  • 如果 jQuery 验证失败,JSLint 有什么用?

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 如何在警报或确认框中显示粗体文本?

    如何获取粗体文本并更改警报或确认框中文本的颜色 var conFrm confirm Following List s already Sent n strong List Name strong ss replace n b Name b
  • 用户输入时的空闲时间

    我遇到的问题是一个搜索函数 它应该调用我的doSearch 用户在我的系统中停止输入至少 100 毫秒后的方法 input q field 我试图通过使用这个逻辑来实现这一点answer https stackoverflow com a
  • 为什么 getSession() 在短时间内间隔的后续请求中不返回相同的会话?

    我正在发送一个 getJSON HTTP GET 请求两次 使用不同的数据 一次又一次 假设我们有 request1 和 request2 我可以在 FF 和 Chrome 的开发者工具中看到我有相同的cookie JSESSIONID F
  • 使用 JS 或 Jquery 禁用浏览器窗口中的声音

    有没有办法禁用可能嵌入视频的浏览器窗口上的所有声音 我不是在寻找特定的解决方案 例如使用 js 等定位 Youtube 我需要一些通用的东西来关闭该页面的所有声音 这样如果任何视频播放它就没有声音 需要一些在页面级别关闭声音的东西 而不是通
  • Chrome 扩展 - 使用 javascript 定期运行并永久记录数据

    目前 我有一个脚本 当单击右上角托盘中的图像 仅适用于一个特定允许的网站 时 它会扫描 HTML 页面 然后输出一些值 此扫描和输出是单个 JS 文件中的函数 称为 checkData js 即使用户没有主动使用选项卡但它已打开 是否有可能
  • 从字符串渲染 React 组件

    我在字符串中有一些 React 代码 例如 const component function App return div test div 我希望能够从浏览器内渲染该组件 例如 import React Component from re
  • JavaScript 使用多少位来表示数字?

    JavaScript 使用多少位来表示数字 一般JS实现使用64位双精度浮点数 对 32 位整数执行按位运算
  • 如何通过 JQuery Post 传递 Javascript 数组,以便可以通过 PHP $_POST 数组访问其所有内容?

    如何通过 JQuery Post 传递 Javascript 数组 以便可以通过 PHP POST 数组访问其所有内容 请展示一个可以实现此目的的代码示例 Thanks 如果你想传递一个 JavaScript 对象 哈希 即 PHP 中的关
  • 将文本字段输入限制为仅数字

    我搜索过谷歌 但我能找到的所有解决方案都非常复杂和冗长 我需要的是将我正在进行的调查中的文本字段的输入限制为仅数字 最快 最干净的方法是什么 我使用的是严格的 HTML 4 01 和 ECMAScript 提前致谢 最快
  • 无限滚动 jQuery 和 Laravel 5 分页

    我成功从控制器返回数据 public function index posts Post with status verified gt paginate 30 return view show gt with compact posts
  • jQuery UI .buttonset() 太慢

    我的 HTML 页面上有几千个按钮 运行需要10多秒 buttonset buttonset 文件准备好 有没有更快的方法来做到这一点 或者是我以某种方式限制按钮数量的唯一解决方案 创建buttonset在第一次显示之前按需进行 我刚刚测试

随机推荐