tipsy live does not work with jQuery 1.9.0

2019-04-03 11:56发布

We recently upgraded our jQuery to 1.9.0, but it broke our tipsy plugin. Its live functionality now causes an error.

$('.tooltip, abbr').tipsy({
    live: true
});

TypeError: this[binder] is not a function

Are there any fixes or patches for this? Googling didn't lead to anything useful.


UPDATE:

Thanks for the answers. I decided to try to fix the issue myself, because I couldn't find any patches.

Upon inspection the error seemed really easy to trace. The tipsy plugin can easily be patched to use the on functionality instead of the deprecated live functionality. In the tipsy plugin, I replaced the following code:

if (options.trigger != 'manual') {
    var binder = options.live ? 'live' : 'bind',
        eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus',
        eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur';
    this[binder](eventIn, enter)[binder](eventOut, leave);
}

with:

if (options.trigger != 'manual') {
    var eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus',
        eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur';
    if (options.live)
        $(document).on(eventIn, this.selector, enter).on(eventOut, this.selector, leave);
    else
        this.bind(eventIn, enter).bind(eventOut, leave);
}

Works like a charm. :)

2条回答
走好不送
2楼-- · 2019-04-03 12:03

The problem is that this plugin still use .live() to let work the method live you used there, it is deprecated and has been replaced with .on().

You should try to search for updated version of the plugin or try to replace it by yourself.

查看更多
forever°为你锁心
3楼-- · 2019-04-03 12:20

you need to include jquery migration plugin, since you are using live:true it make use of jquery.live which was removed in jquery 1.9.

For backward compatibility they have created a migration plugin which can be downloaded here and include the migration plugin to add back support for the removed methods and utilities.

I would be doing something like

if (options.trigger != 'manual') {
    var eventIn  = options.trigger == 'hover' ? 'mouseenter' : 'focus',
        eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur';
    if(options.live){
      $(this.context).on(eventIn, this.selector, enter).on(eventOut, this.selector, leave);
    } else {
      this.on(eventIn, enter).on(eventOut, leave);
    }
}
查看更多
登录 后发表回答