将事件添加到Jquery插件

Question

我有一个JQuery插件,我想添加一些事件.任何帮助,提示或教程？

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');
    }
});

Answer 2

在你的jquery插件中,你要做的第一件事是在你的插件代码中的某个地方触发自定义事件:

$( "#someElement")触发( "someSpecialEvent").

如果需要,您还可以在触发器功能内部传递数据.

$("#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();
        });
 }