javascript - 从外部调用 jQuery 插件中的函数

Question

我正在尝试研究如何从插件外部调用我的 jQuery 插件中的函数。我试过的代码不起作用。我确定我将不得不重组我的插件以允许这样做，但我不确定如何去做。在此示例中，我尝试访问 underline() 函数。

jsFiddle

jQuery 插件

(function($) {
    "use strict";

    $.fn.testPlugin = function(options) {

        // Settings
        var settings = $.extend({
            newText : "Yabadabado"
        }, options);

        return this.each(function(i, el) {            

            var init = function(callback) {
                if( $(el).attr("class") === "red" ) {
                    $(el).css("color","red");
                }

                $(el).text(settings.newText);

                if( callback && typeof(callback) === "function" ) {
                    callback();
                }
            };

            var underline = function() {
                $(el).addClass("underline");
            };

            init();
        });
    };

}(jQuery));

将插件分配给选择器

var doTest = $("#testItem").testPlugin({
    newText: "Scoobydoo"
});

var doNewTest = $("#newTestItem").testPlugin({
    newText: "kapow!"
});    

调用位于插件内的函数

$("#underline").click(function(e) {
    e.preventDefault();
    doTest.underline();
});

Answer 1

看看closures .

这是一个闭包在 jQuery 插件中的基本示例。

$.fn.plugin = function() {

    return {
        helloWorld: function() {
            console.log('Hello World!');
        }
    }
};

// init plugin.
var test = $('node').plugin();

// call a method from within the plugin outside of the plugin.
test.helloWorld();

您可以在以下 jsfiddle 中看到另一个示例。

http://jsfiddle.net/denniswaltermartinez/DwEFz/