如何触发使用jQuery的任意函数调用事件

Question

我想知道是否有可能在调用任意函数时使用jQuery的bind（）来触发自定义事件。类似的，

/* when cmsPlugin.func() is called, fire myCustom.func() too */ 
$.bind(cmsPlugin.func, myCustom.func); 

我们在网站上使用Drupal的Lightbox2插件。

当灯箱显示时，我想激发一些自定义代码，这些代码将附加到点击灯箱中的“下载”链接上。

的Lightbox2插件似乎并没有调用$ .trigger（），所以我有几个选择 -

• 查找绑定到JavaScript函数调用的方式。 （在这种情况下，Lightbox.end我相信）。
• 使用现有的事件，例如$（document）.ready，它可能会作为灯箱显示的一部分被激发。
• 扩展现有函数以添加$ .trigger（）调用。
• 在检测到单击了lightbox-triggering元素后，重复一次锤击myCustom.func（）一段时间。 （EWWW）
• __ _ __ _ __？

---

解决方案

我试图通过使用cmsPlugin.func/myPlugin.func简化我的问题，但我想我可能这样做混淆了自己。但是，我希望所发布的解决方案对于未来的读者来说是足够通用的。

感谢Adam和Lucho。我没有与Lucho的建议有任何运气，但我怀疑这是我自己的错，而不是Lucho的:)

起初我试过Lucho的示例代码，修改它以激发Drupal.zipcart.init（）时Lightbox .updateNav被执行。这对我不起作用。

我决定对Lightbox.updateNav（）进行扩展，因为它是一个简单的函数，在Lightbox2的显示方法中称为late。

我在修改卢乔的代码看起来像这样，但没有成功尝试 -

// NOT THE RIGHT SOLUTION (for me) 
Lightbox.updateNav = function(_dz, _lb) { return function() { 
     _lb.updateNav(); 
     _dz.init(); 
    }; 
}(Drupal.zipcart, Lightbox); 

这是我结束了使用基于亚当的答案，它允许Drupal的ZipCart和Lightbox2模块，很好地一起玩的代码，在Lightbox中使用类=“zipcart”的链接将文件正确添加到下载购物车。

(function(){ 
    var _updateNav = Lightbox.updateNav; 
    Lightbox.updateNav = function() { 
    $(document).bind('lightbox.updateNav', function() { 
     Drupal.zipcart.init(); 
    }); 
    $("#lightbox").trigger('lightbox.updateNav'); 
    _updateNav.apply(this, arguments); 
    } 
})(); 
$(document).bind('lightbox.updateNav', function() { Drupal.zipcart.init(); }); 

Answer 1

不能事件侦听器绑定到一个函数。事件是由DOM节点绑定和触发的，因此您需要知道如何选择灯箱的标记。 jQuery现在可以做到这一点，但你仍然需要一个包装来触发事件。

我可以想到的最简洁的方式来完成这个将包装Lightbox.updateNav函数并触发一个自定义事件。

(function(){ 
    var _updateNav = Lightbox.updateNav; 

    Lightbox.updateNav = function() { 
    $("#lightbox").trigger('lightbox.updateNav'); 
    _updateNav.apply(this, arguments); 
    } 
})(); 

#lightbox需要指向您可以绑定事件监听器的灯箱标记。我不太了解LightBox2的API，告诉你如何完全做到这一点。

这比简单的包装函数更好，因为您可以根据需要连接尽可能多的监听器。

$("#lightbox").bind('lightbox.updateNav', function() {}) 

由于收藏标记很可能是动态创建和销毁，你会过得更好使用delegate代替（前提是你有机会获得的jQuery 1.4.2）。如果你能找出其中的标记插入，附加委托父元素：

$('#lightbox-parent').delegate('#lightbox', 'lightbox.updateNav', function() {}) 

这是更好的性能比.live()所以我想如果可以的话建议做这种方式。

Answer 2

cmsPlugin.func = function(myCustom, cmsPlugin) { return function() { 
     cmsPlugin.func(); 
     myCustom.func(); 
    }; 
}(myCustom, cmsPlugin);