javascript - 创建对象后附加一个jquery事件

Question

我正在使用 bPopup jquery 库。添加到 onclose 事件的语法非常简单：

$('element_to_pop_up').bPopup({
     onOpen: function() { alert('onOpen fired'); }, 
     onClose: function() { alert('onClose fired'); }
})

我想要做的是在创建对象后向 onClose 事件添加一些东西。这可能吗？

Answer 1

通常，您可以通过创建一个稍后摆弄的函数来做到这一点：

var myOnClose = function() { alert('onClosed fired'); }
function doOnClose() { myOnClose(); }

$('element_to_pop_up').bPopup({
    onOpen: function() { alert('onOpen fired'); }, 
    onClose: doOnClose
})

// later...
myOnClose = function() { console.log("Doing something different!"); }

Answer 2

您可以访问bPopup将出现在data元素内部的对象。

$('element_to_pop_up').bPopup({
    onOpen: function() { alert('onOpen fired'); }, 
    onClose: function() { alert('onClose fired'); }
});

$('element_to_pop_up').data('bPopup');

注意：不能保证创建的对象将始终存在于元素的数据中。但这是广泛使用的方法。最好依赖提供的回调。

Answer 3

var realOnclose = f1;
function myOnClose(){realOnclose();}
 $('element_to_pop_up').bPopup({ 
    onOpen: function() { alert('onOpen fired'); },
    onClose: myOnClose
})

function f1() { alert('onClose fired'); } 
function f2() { alert('hey I am another function'); } 

//when you want to change the action when onclose...
realOnclose = f2;

Answer 4

如果您想添加而不是替换您最初提供给onClose选项的代码，您可以触发自定义事件：

$('element_to_pop_up').bPopup({
    onClose: function() {
        // Do the original stuff here.
        this.trigger('popup:close');
    }
});

然后，您可以随时为自定义事件注册一个处理程序：

$('element_to_pop_up').on('popup:close', function() {
    // Do the additional stuff here.
});

注意：查看 bPopup 库的代码，看起来onClose函数的上下文是原始 jQuery 对象，但如果不是，请替换为：$('element_to_pop_up').trigger('popup:close');。