jquery error Uncaught TypeError: ((x.event.special[i.origType] || (intermediate value)).handle || i.handler).apply is not a function
问题
jquery error:
Uncaught TypeError: ((x.event.special[i.origType] || (intermediate value)).handle || i.handler).apply is not a function
思路
可能的问题来源
按照网上的方法一一排查
1. 事件监听的函数没有具体内容
// Not Working
$('#btnClick').click(function(){ //code })
- 调用的方法不存在
var foo = {
bar1: function(){
alert('working');
}
};
// Not Working because bar2 doesn't exist
$('body').on('click', '.my-button', foo.bar2);
// Working
$('body').on('click', '.my-button', foo.bar1);
- 手误绑定了两次
// Not Working
$(document).on('change', '#selectInput').on('change', '#selectInput', function () {});
// Working
$(document).off('change', '#selectInput').on('change', '#selectInput', function () {});
- 监听写法错误
// Not Working
$('body').click('click','.delete_item',function(e){})
// Working
$('body').on('click','.delete_item',function(e){})
- 监听事件handler不是function
// Not Working
$('.foo').click($('.bar').trigger('click'));
// Working
$('.foo').click(function () {
$('.bar').trigger('click');
});
- 监听的元素不存在
// Not Working if '.js-test' didn't exist anymore.
$(document).on('click', '.js-test', App.test);
一般情况下，监听写的不多，或者已知最近改了哪几个地方，是可以查出来的。但是如果元素特别多，一眼看不出来的情况，就需要使用点调试手段。
如何调试出问题点？
步骤：
1. 格式化format jquery
2. 找到报错的地方，在后面打印event的console，参考如下打印方法：
((p.event.special[r.origType] || {}).handle || r.handler).apply(o.elem, l) || console.log(t)
- 复现bug，在报错出现后，找到报错之前的console日志，点开event找到handleObj.handler，一般情况下这个handler是一个function，你可以看看其他正常的情况，但是在这里，这可能是一个对象或者字符串，所以在这之后绑定的apply会报错，这时候就能根据这里的信息，去代码里搜索定位了。
比如我的错误是这样的，我在这个位置的handler是
{
guid: 12
preventScroll: true
}
是一个对象，随机搜索’preventScroll’发现了一段代码
$("#" + selector).attr("tabindex", 0).focus({
preventScroll: true
});
但是focus里面是支持这种写法的，所以删除tabindex即可
$("#" + selector).focus({
preventScroll: true
});
参考
https://stackoverflow.com/questions/32231036/uncaught-typeerror-x-event-speciali-origtype-intermediate-value-handl