将函数内的函数调用到init

时间:2012-06-28 15:44:47

标签: jquery function variables plugins init

;(function ($, w, d, config, undefined) {
$.fn.pluginName = function ( options, config ) {
    var pluginName = this;
    var defaults = {
        //defaults
    };
    var settings = $.extend({}, defaults, options);

    var methods = {
        init :  function ( settings, options ) {
            //init stuff here
        }
    }
})
})(jQuery, window, document)

// HTML looks like this
<script>
$('.item').pluginName({ methods : 'init' });
</script>

我是插件开发和一般对象的新手,但我试图在没有游泳的情况下深入学习。 :)

基本上,我想通过调用methods变量中的“init”函数来初始化我的插件。我的插件名称是“pluginName”。

我无法调用“init”fn,因为它位于名为“methods”的变量中。

另外,为了更进一步,我需要收集页面上的所有“item”类,并在里面设置一个数据变量。在我的init函数中,我有以下内容:

return this.each(function(){

    var $this       = $(this),
    data        = $this.data('pluginName');

    if ( ! data ) {
        $(this).data('pluginName', {
        target : $this
        });

    }
}).bind(this);

以上返回“this.each不是函数”

任何帮助将不胜感激!非常感谢!!

1 个答案:

答案 0 :(得分:2)

为了使它不必传入方法调用的对象,我通常使用这种格式:

(function($) {
    function doSomething() {
        // Only callable in this plugin's context (I think)
    }

    var methods = {
        init: function (options) {
            // Do whatever for init!
            doSomething();
        },

        anotherMethod: function (options) {
            // Some other method
            doSomething();
        }
    };

    $.fn.pollServer = function(method) {
        var args = arguments;
        var argss = Array.prototype.slice.call(args, 1);

        return this.each(function () {
            $this = $(this);
            if (methods[method]) {
                methods[method].apply($this, argss);
            }
            else if (typeof method === "object" || !method) {
                methods.init.apply($this, args);
            }
            else {
                $.error("Method " + method + " does not exist on jQuery.pollServer");
            }
        });
    };
})(jQuery);

您可以像访问它一样访问它:

$("#div").pollServer({});
$("#div").pollServer("init", {}); // Same as above line

$("#div").pollServer("anotherMethod", {});

返回this.each()内部的所有内容确定要调用的方法,并将“this”变量设置为所选的jQuery元素。它还将其他参数传递给方法。

希望这有帮助!