Jquery find(...).live is not a function

Question

I recently update my jquery library to 3.3.1 and since then the jquery.fileupload-ui breaks here

 _initEventHandlers: function () {
        $.blueimp.fileupload.prototype._initEventHandlers.call(this);
        var filesList = this.element.find('.files'),
            eventData = { fileupload: this };
        filesList.find('.start a')
            .live(
                'click.' + this.options.namespace,
                eventData,
                this._startHandler
            );
        filesList.find('.cancel a')
            .live(
                'click.' + this.options.namespace,
                eventData,
                this._cancelHandler
            );
        filesList.find('.delete a')
            .live(
                'click.' + this.options.namespace,
                eventData,
                this._deleteHandler
            );
    },

My sense is that live is deprecated.

How can I modify this code as a way to fix this ?

Kind regards

Answer 1

Your feeling is correct, live() was deprecated a long time ago and has been removed.

The modern approach is to use the delegated signature of the on() method. Given your code, it would look like this:

_initEventHandlers: function() {
  $.blueimp.fileupload.prototype._initEventHandlers.call(this);
  var filesList = this.element.find('.files'),
    eventData = { fileupload: this },
    clickEventName = 'click.' + this.options.namespace;

  filesList.on(clickEventName, '.start a', eventData, this._startHandler);
  filesList.on(clickEventName, '.cancel a', eventData, this._cancelHandler);
  filesList.on(clickEventName, '.delete a', eventData, this._deleteHandler);
},