触发由不同实例设置的jQuery自定义事件

时间:2013-11-01 20:25:52

标签: javascript jquery

有没有办法触发由不同jQuery实例设置的自定义事件?例如:

// Load version 1.9.1
...
jQuery191(document).on('customEvent', function () {console.log('Callback fired.')});

// Load version 1.6.2 and setup noConflict
...
jQuery162(document).trigger('customEvent');

虽然加载多个版本的库不是recommended,但是一个简单的用例是一个插件,如果当前实例低于预期,它会引入特定版本的jQuery。有什么建议吗?

1 个答案:

答案 0 :(得分:1)

如果页面上有不同的实例(即使是相同版本),您应该非常小心,因为这可能会导致意外行为,并可能导致内存泄漏,例如:如果删除带有jQuery191的元素,该元素具有与.data(...)一起存储的数据(jQuery162或事件侦听器),则该元素将保留在内存中,直到您重新加载页面为止。< / p>

但回到你的问题。 我不推荐它,但你可以加倍事件(用两个版本触发它)。 这种方法的问题在于它会减慢一切。 另一个问题是你有两个冒泡阶段。因此,如果您在jQuery191中阻止该事件,它仍将在jQuery162中执行,反之亦然。

所以它可能是一个适合你的解决方案,但它也可能使事情变得更糟。 因此,如果您可以使用此解决方案,则需要检查自己。 也许你也可以删除其中一个加倍的部分。

(function() {
    //keep the original functions
    var trigger191 = jQuery191.fn.trigger;
    var trigger162 = jQuery162.fn.trigger;

    jQuery191.fn.trigger = function( evt ) {
        trigger191.apply(this,arguments); //call orginal function

        //only double certain events
        if( evt == "my-custom-event" ) {
            var resultset162 = jQuery162(jQuery191.makeArray( this ));//create a ne result set of the 162 version
            trigger162.apply(resultset162,arguments); //call the original function of 162 to avoid an endless loop
        }
    };

    jQuery162.fn.trigger = function(evt) {
        trigger162.apply(this,arguments); //call orginal function

        //only double certain events
        if( evt == "my-custom-event" ) {
            var resultset191 = jQuery191(trigger162.makeArray( this ));
            trigger191.apply(resultset191,arguments); //call the ofiginal function of 191 to avoid an endless loop
        }
    };

})();

(我希望代码以这种方式工作。我很确定它应该可行,但我现在无法测试它)