javascript - jQuery 暴露插件函数

Question

我们的一位老开发人员构建了一个 jQuery 插件，如下所示:

jQuery.fn.limelight = function(options) {  

/*Skipped code here*/

jQuery(".spotlight-btn.back a").click( function (e) {

            if(lastSelectedCastIndex - 1 >= 0) {
                removeFromSpotlight();
                lastSelectedCastIndex--;
                e.preventDefault();
                $.address.value(lastSelectedCastIndex);
                ca$t.scroll(jQuery.jcarousel.intval(lastSelectedCastIndex), true);
                switchTo(lastSelectedCastIndex);
            }
            return false;
        });

function switchTo(i)
{
    ca$t.scroll(jQuery.jcarousel.intval(i), true);
    $.address.title($("#title_text").text());
    putInSpotlight();
}
};

我没有做过任何 jQuery 插件编程，但想公开 switchTo 函数，以便可以在任何地方调用它。我怎么能做到这一点？

Answer 1

这对您的目的来说可能有点矫枉过正，但您的开发人员似乎并没有真正理解或掌握 jQuery 插件的目的。

您希望插件有点通用，它可以接受选择器并将事件、样式、动态 html 应用到选择器中找到的项目。看起来他写了一个“插件”是为了一个单一的目的……也许只是为了维持某种组织。

大多数插件都遵循与此类似的形式:

; (function ($) {
    $.fn.limelight  = function (method) {
        var methods = {
            //Initialize the plugin
            init: function (options) {
                return this.each(function () {
                //Refactor to conform to plugin style
//                    $(this).click( function (e) {
//                        if(lastSelectedCastIndex - 1 >= 0) {
//                            removeFromSpotlight();
//                            lastSelectedCastIndex--;
//                            e.preventDefault();
//                            $.address.value(lastSelectedCastIndex);
//                            ca$t.scroll(jQuery.jcarousel.intval(lastSelectedCastIndex), true);
//                            switchTo(lastSelectedCastIndex);
//                        }
//                        return false;
//                    });
                });
            },

            switchTo: function (i) {
            //Refactor to conform to plugin style
//                ca$t.scroll(jQuery.jcarousel.intval(i), true);
//                $.address.title($("#title_text").text());
//                putInSpotlight();

            }
        };

        if (methods[method]) {
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (typeof method === 'object' || !method) {
            return methods.init.apply(this, arguments);
        } else {
            $.error('Method ' + method + ' does not exist on jQuery.limelight');
        }
    };
})(jQuery);

//Following this pattern you'd be able to call your plugin like this. 
$(".spotlight-btn.back a").limelight();
$(".spotlight-btn.back a").limelight("switchTo", 0);

这是关于该主题的官方文档:http://docs.jquery.com/Plugins/Authoring