创建对象后附加 jquery 事件

Question

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

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

我想做的是在创建对象后向 onClose 事件添加一些内容..这可能吗？

Answer 1

一般来说，您可以通过创建一个您 fiddle 以后使用的函数来做到这一点：

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

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

$('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');.

创建对象后附加 jquery 事件

Attach a jquery event after object is created

javascript

jquery

popup

bpopup