jQuery Apply Is Not a Function

#web

Question

jquery error:

Uncaught TypeError: ((x.event.special[i.origType] || (intermediate value)).handle || i.handler).apply is not a function

Ideas

Possible source of the problem

Follow the online method to check one by one

  1. The event monitoring function has no specific content
// Not Working
$('#btnClick').click(function(){ //code })
  1. The called method does not exist
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);
  1. The hands are bound twice by mistake
// Not Working
$(document).on('change','#selectInput').on('change','#selectInput', function () {});

// Working
$(document).off('change','#selectInput').on('change','#selectInput', function () {});
  1. Wrong way of listening
// Not Working
$('body').click('click','.delete_item',function(e){})

// Working
$('body').on('click','.delete_item',function(e){})
  1. The event handler is not a function
// Not Working
$('.foo').click($('.bar').trigger('click'));

// Working
$('.foo').click(function () {
  $('.bar').trigger('click');
});
  1. The monitored element does not exist
// Not Working if'.js-test' didn't exist anymore.
$(document).on('click','.js-test', App.test);

Under normal circumstances, there are not many monitor writes, or you can find out which places have been changed recently. But if there are so many elements that you can't see at a glance, you need to use some debugging methods.

How to debug the problem?

Steps:

  1. Format jquery
  2. Find the place where the error is reported, and print the console of the event later, refer to the following printing method:
((p.event.special[r.origType] || {}).handle || r.handler).apply(o.elem, l) || console.log(t)
  1. Reproduce the bug. After the error is reported, find the console log before the error, and click event to find handleObj.handler. In general, this handler is a function. You can look at other normal situations, but here, this is possible It is an object or a string, so the bound apply will report an error after this. At this time, you can search and locate in the code based on the information here.

For example, my error is like this, my handler at this position is

{
    guid: 12
    preventScroll: true
}

Is an object, a random search for preventScroll found a piece of code

$("#" + selector).attr("tabindex", 0).focus({
    preventScroll: true
});

But this way of writing is supported in focus, so delete tabindex.

$("#" + selector).focus({
    preventScroll: true
});

Reference

Uncaught TypeError: ((x.event.special[i.origType] || (intermediate value)).handle || i.handler).apply is not a function

Comments