Question

我正在开发一个名为popup的jQuery插件。这是我的第一个jQuery插件，所以我试图按照jQuery网站上的教程。我想实现一些我在参考文献中没有找到的东西：onOkay( function(e){ });事件。我希望开发人员能够像这样调用这个事件处理程序：

$("#message").popup().onOkay(function( e ) {
    // some code here
});

我需要做些什么来实现这样的代码？

Answer 1

基本上你需要将一个函数传递给你的插件并将其用作回调。这里有一些简单的伪代码来展示一个例子：

plugin_func = function( params, callback ){
    // Do some awesome stuff with params
    var callback_arguments = 'foo' + params;
    callback( callback_arguments );
}

现在使用这样的回调函数调用此函数：

plugin_func('bar', function( response ){ 
    console.log( response );
});

如果您需要使用回调来操作范围，这是使用回调的另一种方法：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply

callback.apply( thisScope, [ array_of_args_passed_to_callback ]

Answer 2

如果它只是一个事件处理程序，让你的插件触发所述事件，那么你可以像任何其他事件一样绑定到事件处理程序。

$.fn.myPlugin = function(){
    return this.each(function(){
        var $self = $(this);

        ... generate markup and show popup ...
        okbtn.on('click',function(e){
            e.preventDefault();
            if ( $self.triggerHandler("mypluginok") ) {
                // do your plugin stuff
            } 
        });

    });
};

$("#someel").myPlugin().on("mypluginok",function(){
    console.log("Ok button pressed!")
    // return false; // this would prevent the plugin's click handling
})

如果所述其他插件还在onOkay上定义了onOkay方法，则不建议添加$.fn等其他方法，因为这可能与其他插件冲突。

在jQuery中创建插件的自定义事件

2 个答案: