【问题标题】:Adding additional functions within a jQuery plugin在 jQuery 插件中添加附加功能
【发布时间】:2012-01-29 03:06:51
【问题描述】:

我开始在自己的命名空间中编写更多的 jQuery 插件,这样我就可以重复使用代码并保持我的代码 DRY。

我是整个插件创作的新手,但阅读了一些资料,包括官方的 jQuery 资料。

这是我发现我正在玩的一个例子:

(function($) {
    // jQuery plugin definition
    $.fn.reverseText = function(params) {
        $.fn.reverseText.test();
        // merge default and user parameters
        params = $.extend({
            minlength: 0,
            maxlength: 99999
        }, params);
        // traverse all nodes
        this.each(function() {
            console.log($(this).parent().data('url'));
            // express a single node as a jQuery object
            var $t = $(this);
            // find text
            var origText = $t.text(),
                newText = '';
            // text length within defined limits?
            if (origText.length >= params.minlength && origText.length <= params.maxlength) {
                // reverse text
                for (var i = origText.length - 1; i >= 0; i--) newText += origText.substr(i, 1);
                $t.text(newText);
            }
        });
        // allow jQuery chaining
        return this.each;

    };
    // Is this correct?
    $.fn.reverseText.test = function() {
    alert('test');
    };
})(jQuery);


$(function() {
    $(".js-test-whatever li:even").reverseText();
});

通常我会创建一个这样的命名空间:

 var a = {

    };

    a.reverseText = {
        init: function () {
         reverseText(); 
        });
    },

    reverse: function() {
     $(function() {
        return foo;
      });
    }

    a.reverseText.init();

那么在 jQuery 插件命名空间中添加多个函数的正确方法是什么?

查看第一个示例中的注释,我在其中包含了一个附加函数。

【问题讨论】:

    标签: javascript jquery plugins jquery-plugins


    【解决方案1】:

    这是一种可以接受的方式。另一种方法可能是这样的:

    (function($) {
        var reverse = {
            test: function () {
                alert('test');
            },
    
            fn: function(params) {
                reverse.test();
    
                /* the rest of your plugin code */
            }
        }
    
        // jQuery plugin definition
        $.fn.reverseText = reverse.fn
    })(jQuery);
    

    没有一种“正确”的方法。只需使用最适合您当前正在进行的项目的方法即可。

    【讨论】:

    • 很酷,谢谢 alec :) 我会尝试这种方式,看看我是否喜欢它。
    猜你喜欢
    • 2011-02-01
    • 2015-10-29
    • 1970-01-01
    • 2014-09-22
    • 1970-01-01
    • 2012-08-08
    • 1970-01-01
    • 1970-01-01
    • 2020-08-17
    相关资源
    最近更新 更多