向Jquery插件添加事件

Question

我有一个 JQuery 插件，想要为它添加一些事件。 有任何帮助、提示或教程吗？

- user495093

---

https://dev59.com/fEXRa4cB1Zd3GeqPvN23 - Haim Evgi

嗯，什么插件？如果我们不知道它是关于什么的，我们就无法回答任何问题... - Anriëtte Myburgh

@Anriëtte Combrink：这是一个弹出式插件，我想在关闭后执行一些操作。[链接]（http://yensdesign.com/2008/09/how-to-create-a-stunning-and-smooth-popup-using-jquery/） - user495093

Answer 1

如果你有某种关闭弹出窗口的按钮，并且你需要在关闭后触发一个函数，那么我的理解是这样的。

(function($) {
  $.fn.somePlugin = function(options) {
    // do some stuff with popup
    $('#closeButton').click(function(e) {
      //close popup
      if (options.onAfterClose !== undefined) {
         options.onAfterClose(e);
      }
    });
  };
})(jQuery);

它只是将点击事件从一个事件传递到另一个事件。

$('#someId').somePlugin({
    onAfterClose: function(e) {
        alert('after close');
    }
});

- jcubic

---

我有一个类似的插件结构，只是我正在设置 'e' 具有特定的值，应该作为参数传递，但它总是为空。所以没有参数！有什么想法吗？ - Jacques

成功排序了。这与在JavaScript中使用.call有关，其中传递的第一个参数应该是“this”，例如onChange.call(this,thenParameters)。 - Jacques

正是我所寻找的，你理解问题做得很好！ - user2233219

选项也应该检查未定义的情况。 - Wilko van der Veen

Answer 2

在你的jQuery插件中，首先要做的是在插件代码中某处触发你的自定义事件：

$("#someElement").trigger("someSpecialEvent");

如果需要的话，你也可以在trigger函数内部传递数据。

$("#someElement").trigger("someSpecialEvent", "this does not need to be a string");

接下来，在插件代码的其他地方创建一个事件处理程序来处理你自定义的事件：

$("#someElement").bind("someSpecialEvent", function(event, data) {
    //If you had passed anything in your trigger function, you can grab it using the second parameter in the callback function.
});

你可以允许用户像这样传递一个回调函数作为选项：

您可以让用户通过选项传递回调函数，如下所示：

$("#sampleElement").myPlugin({ 
    someEvent: function() {
        //user logic
    }
});

最后，在您的插件代码中，您可以以几种不同的方式调用用户的函数。例如：

$.fn.samplePlugin = function(options) {
        options = $.extend({}, $.fn.samplePlugin.options, options);
        $("sampleElement").bind("specialEvent", function() {
             options.someEvent.call();
        });
 }

- Greg Franko

Answer 3

jQuery文档包含有关触发事件的所有内容

任何使用$.bind()附加到事件的元素都会被通知事件已被触发并执行其代码。

示例：

$(document).trigger('my.event');

jQuery支持 "命名空间" 事件，因此您可以将事件命名为 mypluginName.eventName，以确保没有其他插件干扰您的事件;)

简单而清晰，但要小心，文档中指出：

虽然 .trigger() 模拟了一个事件激活，包括合成的事件对象，但它并不能完全复制自然发生的事件。

祝您有美好的一天

- usoban

Answer 4

$("#someElement").on("someSpecialEvent", function(event) {

});

当某个元素发生特定事件时，执行一个函数。

- Mohammed Medhat

---

你的回答可以通过提供更多支持信息来改进。请编辑以添加进一步的细节，例如引用或文档，以便他人可以确认你的答案是正确的。您可以在帮助中心中找到有关如何编写良好答案的更多信息。 - Community