如何找出哪些 JavaScript 函数触发了 HTML 更改？答案

【问题标题】：How to find out what JavaScript function triggered HTML change?如何找出哪些 JavaScript 函数触发了 HTML 更改？
【发布时间】：2015-09-29 19:39:18
【问题描述】：

我在 WordPress 网站上遇到问题。我有一个向下滑动某个<div> 的功能。它是：

jQuery(function($){
    $(document).on('click','.tb_usertask_title',function(){
        var title = $(this);
        var key = title.data('key');
        var msg = $('#tb_msg_'+key);
        msg.slideDown('fast');
    }
});

执行此函数后，<div> 立即再次向上滑动。我认为这可能是由于另一个脚本，但我完全不知道如何找到执行此操作的函数。有什么办法可以找出来吗？我尝试过的事情：

在我的函数中添加断点。这向我表明折叠发生在我的职能之外。
使用 Firebug 中断 HTML 更改。然而，这重定向到 jquery.js，但我不知道如何找出触发 jQuery 的函数。
使用 Firebug 列出我的 onclick 事件的事件，但这仅显示了我的功能。

这些对我不起作用。我还搜索了一种在 Firebug 中进行函数回溯的方法，但没有任何成功。

【问题讨论】：

你也在用bootstrap吗？
否（最少 15 个字符）
出于测试目的，如果您将点击事件绑定到元素并停止传播，行为是否相同？ $('.tb_usertask_title').on('click', function(e){ e.stopPropagation(); //... });

标签： javascript jquery html firebug

【解决方案1】：

使用未缩小版的 jQuery（仅用于测试，因为它更易于调试）。
寻找调度函数。
在有 apply 用法的函数中放置断点。
代码中断后，使用 F11 导航到绑定函数。

【讨论】：