1

我已经构建了一个小函数，它返回一个应用于某个元素的 jQuery 插件，如下例所示：

var initiate_shop = function(shop_navigation, options, callback) {

    var default_settings = {
        containerID     : "",
        first           : false,
        previous        : false,
        next            : false,
        last            : false,
        startPage       : 1,
        perPage         : 8,
        midRange        : 15,
        startRange      : 1,
        endRange        : 1,
        keyBrowse       : true,
        scrollBrowse    : false,
        pause           : 0,
        clickStop       : true,
        delay           : 50,
        direction       : "auto",
        animation       : "fadeInUp",
        fallback        : 400,
        minHeight       : true,
        callback        : function(pages, items){
            if(typeof callback == 'function') {
                callback.call(this);
            }
        }
    };

    var settings = $.extend(default_settings, options);

    return $(shop_navigation).jPages(settings);
};

我的问题是，我怎么能initiate_shop像这样使用该功能：

$("shop_navigation").initiate_shop( ... );

而不是像这样使用它：

initiate_shop(shop_navigation, ... );

另外，如何为回调函数定义参数，在我的情况下，我有两个对象作为回调函数的参数？

4

1 回答 1

3

看起来您正在尝试创建一个 jQuery 插件。使用您的函数扩展$.fn对象，您将能够使用this函数中的关键字访问您的容器。

$.fn.initiate_shop = function(options, callback) {
    ...
    return this.jPages(settings);
};

请注意，您的调用$('shop_navigation')不是有效的选择器，除非您正在寻找名为shop_navigation. 你打算写$('#shop_navigation')吗？

我问的原因是你也可以写 

$('.shop_navigation').initiate_shop(options, callback);

由您的插件来处理支持传入的多个元素this。

.call如果您想指定上下文（即this关键字）在您的回调函数中，您当前调用回调的方式非常有用。

考虑您的回调如下所示：

var callback = function(pages, items) {
   console.log(this);
   console.log(pages);
   console.log(items);
};

如果您不关心this回调函数中的关键字是什么，您可以简单地将函数调用为

callback(pages, items);

如果要手动设置调用上下文，可以使用.call或.apply。您仍然可以将参数传递给函数：

// first argument defines calling context
// all others passed as arguments to function
callback.call(this, pages, items);

或者

// first argument defines calling context
// second argument defines entire arguments collection
callback.apply(this, [pages, items]);

在您的情况下，如果callback变量只是一个函数或未定义的，并且您没有添加任何额外的逻辑，就像现在一样，您只需：

var default_settings = {
    ...
    callback: callback
};
于 2012-05-10T09:51:57.157 回答