Question

我正在使用jQuery v1.7.1并将事件绑定到元素，如下例所示：

<input id="testTextBox" name="testTextBox" type="text" value="" />

<script type="text/javascript">
    function evtHandler() {
        alert("Event fired!");
    }

    $(function() {
        $("#testTextBox").bind("change", evtHandler);
    });
</script>

显然我的页面有比这更多的控件，包括一些Ajax来替换部分页面。因此，在测试期间，我想有一个简单的方法来查看事件是否成功绑定。我知道我可以在绑定之前检查$("#testTextBox").length以确定是否找到了控件，但这是最好也是唯一的方法吗？

Answer 1

事件不会绑定的唯一原因是DOM元素不存在。

你可以通过填充.on方法来捕获它（不要使用.bind - 它已经过时了，虽然下面的技术仍然有用）：

(function($) {
    var _on = $.fn.on;

    $.fn.on = function() {
        if (this.length) {
            return _on.apply(this, arguments);
        } else {
            throw new Error('.on called on empty jQuery object');
        }
    };
})(jQuery);

出于测试目的，您还可以通过检查每个元素的.data('events')数据中的现有处理程序来扩展此函数以测试重复事件注册，如@paulitto所述。但请注意，这是在挖掘jQuery内部结构，这可能会在未来的版本中发生变化。

Answer 2

对于您的jquery版本，您还可以检查元素'events'jquery data

这会将绑定到测试TextBox的事件作为Object抛出到控制台：

console.log($('#testTextBox').data('events'));

确定jQuery事件绑定是否失败

2 个答案: