Javascript 将事件添加到 Jquery 插件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4942639/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
add event to Jquery Plugin
提问by Raika
I have a JQuery plugin and I want to add some event to it. Any help, tips, or tutorial?
我有一个 JQuery 插件，我想向它添加一些事件。任何帮助、提示或教程？
回答by jcubic
As I understand correctly If you have some kind of button that close the popup and you need a function that is triggered after close.
据我所知，如果您有某种关闭弹出窗口的按钮，并且您需要一个关闭后触发的功能。
(function($) {
$.fn.somePlugin = function(options) {
// do some stuff with popup
$('#closeButton').click(function(e) {
//close popup
if (options.onAfterClose !== undefined) {
options.onAfterClose(e);
}
});
};
})(jQuery);
it just pass the event from click event.
它只是从点击事件传递事件。
$('#someId').somePlugin({
onAfterClose: function(e) {
alert('after close');
}
});
回答by Greg Franko
In your jquery plugin, the first thing you will have to do is trigger your custom event somewhere in your plugin code:
在您的 jquery 插件中，您要做的第一件事是在插件代码中的某处触发您的自定义事件：
$("#someElement").trigger("someSpecialEvent");
$("#someElement").trigger("someSpecialEvent");
You can also pass data inside of your trigger function if you want.
如果需要，您还可以在触发器函数内传递数据。
$("#someElement").trigger("someSpecialEvent", "this does not need to be a string");
Next, create an event handler somewhere else in your plugin code for your custom event:
接下来，在插件代码的其他位置为自定义事件创建一个事件处理程序：
$("#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.
});
You can then allow a user to pass a callback function as an option like this:
然后，您可以允许用户将回调函数作为选项传递，如下所示：
$("#sampleElement").myPlugin({
someEvent: function() {
//user logic
}
});
Finally, inside of your plugin code, you can call the user's function a few different ways. An example would be:
最后，在您的插件代码中，您可以通过几种不同的方式调用用户的函数。一个例子是：
$.fn.samplePlugin = function(options) {
options = $.extend({}, $.fn.samplePlugin.options, options);
$("sampleElement").bind("specialEvent", function() {
options.someEvent.call();
});
}
回答by usoban
jQuery docs has everything about triggering an event
Any element that has been attached to an event using $.bind()will be notified that the event had been triggered and execute its code.
任何已使用附加到事件的元素$.bind()将被通知该事件已被触发并执行其代码。
Example:
例子：
$(document).trigger('my.event');
jQuery supports 'namespaced' events, so you can name the event something like mypluginName.eventNameto make sure no other plugin interferes with you events ;)
jQuery 支持“命名空间”事件，因此您可以为事件命名，mypluginName.eventName以确保没有其他插件干扰您的事件；)
Simple and clean, although be careful, docs state that:
简单而干净，但要小心，文档指出：
Although .trigger() simulates an event activation, complete with a synthesized event object, it does not perfectly replicate a naturally-occurring event.
尽管 .trigger() 模拟事件激活，并带有合成的事件对象，但它并不能完美地复制自然发生的事件。
Nice day
美好的一天
