查看Jquery绑定的事件处理函数

使用jquery中,经常采用下面的方式完成事件绑定:

$(function() {
    $('#submit').click(saveForm);
    $('#username').keyup(logUserName);
})

function saveForm() {
    console.log('saved...');
}

如果是自己开发的程序,比较清楚绑定的是哪个函数,但如果是其他网站呢,我们在不知道源代码结果的情况下,如何快速找出事件的处理函数呢?
下面分享一个专门查看绑定事件的函数:

function lookupEvents (elem, name) {
    return $._data(elem, "events")[name][0].handler;
}

在上面的例子中,在Chrome的控制台中使用效果如下:

lookupEvents($('#submit')[0], 'click')

然后点击下图中红圈中的链接可以直接定位到源代码。

还有一个更简单的方法,就是使用Firefox中的Firebug,可以直接查看jquery绑定的处理函数,效果如下图。

Comments are closed.