Question

我正在尝试提供我的插件回调功能，我希望它以一种传统的方式运行：

myPlugin({options}, function() {
    /* code to execute */
});

或

myPlugin({options}, anotherFunction());

如何在代码中处理该参数？它被视为一个完整的实体吗？我很确定我知道在哪里放置执行代码，但是如何让代码执行？我似乎无法找到很多关于这个主题的文献。

Answer 1

只需在插件中执行回调：

$.fn.myPlugin = function(options, callback) {
    if (typeof callback == 'function') { // make sure the callback is a function
        callback.call(this); // brings the scope to the callback
    }
};

您还可以在选项对象中进行回调：

$.fn.myPlugin = function() {

    // extend the options from pre-defined values:
    var options = $.extend({
        callback: function() {}
    }, arguments[0] || {});

    // call the callback and apply the scope:
    options.callback.call(this);

};

像这样使用：

$('.elem').myPlugin({
    callback: function() {
        // some action
    }
});

Answer 2

我不知道我是否理解你的问题。但对于第二个版本：这会立即调用anotherFunction。

基本上你的插件应该是某种看起来像这样的函数：

var myPlugin = function(options, callback) {
    //do something with options here
    //call callback
    if(callback) callback();
}

您必须提供功能对象作为回调，因此function(){...}或anotherFunction（不包含()）。

Answer 3

从过去带回一阵爆炸声。

值得注意的是，如果你传递了两个参数，例如：

$.fn.plugin = function(options, callback) { ... };

然后你调用插件没有options参数但是回调然后你会遇到问题：

$(selector).plugin(function() {...});

我用它来使它更灵活：

if($.isFunction(options)) { callback = options }

Answer 4

我认为这可能会对你有所帮助

＆＃13;

// Create closure.
(function( $ ) {
  
   // This is the easiest way to have default options.
 
        var settings = $.extend({
            // These are the defaults.
 
            onready: function(){},
 
            //Rest of the Settings goes here...
        }, options );
 
    // Plugin definition.
    $.fn.hilight = function( options ) {
 
        //Here's the Callback
        settings.onready.call(this);
 
        //Your plugin code goes Here
    };
  
// End of closure.
  
})( jQuery );

＆＃13;

我分享了一篇关于创建自己的jQuery插件的文章。我想你应该检查http://mycodingtricks.com/jquery/how-to-create-your-own-jquery-plugin/

Answer 5

更改插件功能以获取第二个参数。假设用户传递了一个函数，该参数可以被视为常规函数请注意，您还可以将回调设置为options参数的属性。

例如：

$.fn.myPlugin = function(options, callback) {
    ...

    if(callback)        //If the caller supplied a callback
        callback(someParam);

    ...
});

Answer 6

示例有点迟了，但它可能很有用。使用参数可以创建相同的功能。

$.fn.myPlugin = function() {
    var el = $(this[0]);
    var args = arguments[0] || {};
    var callBack = arguments[1];
    .....
    if (typeof callback == 'function') {
        callback.call(this);
    }
}

jQuery插件：添加回调功能

6 个答案: