jQuery - 自定义事件完成

Question

我创建了一个自定义灯箱插件，我需要在操作异步完成时创建一个自定义事件/侦听器。 我的目标是在我关闭灯箱或转到下一个/上一个项目时销毁/取消设置视频/iframe 源，以防止错误（特别是在 IE 上）。

例如我已经创建了这个脚本：

$.Lightbox = function() {

    var el;

    function init() {
        /*** do some stuff ***/
        getMedia(el);
    }

    function getMedia(el) {
        media_type = 'video';
        switch(media_type) {
            case 'image':
                /*** do some stuff ***/
                load_image();
                break;
            case 'video':
                /*** do some stuff ***/
                load_video();
                break;
        }
    }

    function load_video() {
        el.on('removeVideo',function() {
            /*** do some stuff ***/
        });
    }

    function load_image() {
        el.on('removeVideo',function() {
            /*** do some stuff ***/
        });
    }

    /*** need to be an event that I can trigger and detect when it's finish ***/
    function removeVideo() {
        /*** just for the example ***/
        if ($('iframe').length > 0) {
            $('iframe').attr('src','').load(function(){
                $('iframe').remove();
            });
        } else {
            $('img').remove();
        }
    }

    $(document).on('click touchend',next_prev, function() {
        el.on('removeVideo',function() {
            getMedia();
        });
        return false;
    });

    $(document).on('click touchend',close, function() {
        el.on('removeVideo',function() {
            /*** do some stuff ***/
        });
        return false;
    });

    init();

};

在插件中创建自定义事件监听器的正确方法是什么。我不知道如何处理它以及创建它的正确方法是什么。

Answer 1

参见 .bind() 和 .trigger() 方法：

http://api.jquery.com/bind/

http://api.jquery.com/trigger/

el.bind("removeVideo", function() {
  // what to do when removeVideo is triggered
});

那么你就可以触发事件了：

el.trigger("removeVideo");

编辑：

removeVideo完成后执行代码

解决方案 1：

function removeVideo() {
    ...
    el.trigger("removeVideoComplete");
}

el.bind("removeVideoComplete", function() {
    // What you want
});

解决方案 2：

function removeVideo() {
    ...
    // simply do what you want ! Maybe call a function ? 
}

解决方案 3：

function removeVideo(callback) {
    ...
    callback(el);
}

...
var callback = function(el) {
    // what you want
}
removeVideo(callback);