javascript - 如何从外部触发的自定义插件内部获取事件而不将其作为参数传递？

Question

我正在制作一个 JQuery 插件，它需要知道调用该插件的上下文事件，以便我可以从内部执行 e.preventDefault(); 。

插件在这里:https://github.com/brenosilver/JQuery.PopupBox

目前我有这个:

    $("#el").click(function(event){
        $("#targetEl").popupBox(event);
    });

但我不希望该事件被传递，因为我试图使其尽可能对用户友好。

在插件中我有这个:

    $.fn.popupBox = function(event, options){
        event.preventDefault();
        event.stopPropagation();
    }

<小时/>

我成功地使用了:

var contextObject = window.getSelection().getRangeAt(0).startContainer.parentNode;  
var event = $._data( $(contextObject)[0], "events" );

但这不会返回 native 事件类型对象。所以我不能使用 event.preventDefault();。

<小时/>

进一步说明:

我需要有 event.stopPropagation 因为如果没有，插件处理的元素只会显示在屏幕上，然后立即隐藏。

Answer 1

根据评论和插件使用示例，在我看来插件的设计应该有点不同。

插件不应该关心外部世界的事件，当然它也不应该干扰事件以及外部发生的任何事情。毕竟，这就是插件的目的 - 插入并运行。

我建议将策略更改为将点击事件绑定(bind)到插件内部的点击目标上。

配置可能如下所示:

$("#targetEl").popupBox({
    clickOn: '#el'
});

或者其他方式:

$("#el").popupBox({
    target: "#targetEl"
});

在这两种情况下，您都可以自己在插件内部绑定(bind)点击事件，并且能够根据需要执行任何事件。