Jquery插件问题

时间:2012-11-27 14:40:35

标签: jquery jquery-plugins

好的,所以我无法理解如何在jquery插件之间共享设置,无论我做什么,我的设置在循环使用元素时都会被覆盖。这是我的代码:

(function ( $ ) {
    var default_settings = { 
        auto_start: false,
        tools: {}
    };

    function test(settings){
        //here is the problem it gets wrong element
        settings.tools.progress_bar.animate({
            width: "100%"
        });
    }

    var methods = {
        init: function(element, options){
            var settings = $.extend({}, default_settings, options);

            settings.tools.progress_bar = $('<div class="test"></div>');

            $(element).append(
                settings.tools.progress_bar
            );

            if(settings.auto_start)
                test(settings);

            $.data(element, "settings", settings);
        },

        start: function(){
            var settings = $.data(this, "settings");

            test(settings);
        }
    }

    $.fn.ajaxupload = function(method, options){
        return this.each(function(){
            if(methods[method])
                return methods[method].apply(this, [options]);
            else if(typeof method === 'object' || !method)
                return methods.init(this, method);
        });
    }
})( jQuery);

我需要能够循环使用多个元素,然后调用公共函数来启动某些操作或其他操作,如下所示:

$(".container").ajaxupload();

$(".container2").ajaxupload();

//even though I call for container it will run animation for container2
$(".container").ajaxupload("start");

我也做过jsfiddle,但至少在我看来它几乎不起作用。

1 个答案:

答案 0 :(得分:2)

Simpy替换

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

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

演示:http://jsfiddle.net/jupSp/12/

如果没有深层复制(第一个参数为true),它只复制第一级对象,在你的情况下它会导致 settings.tools指向default_settings.tools并呼叫settings.tools.progress_bar = $('<div class="test"></div>');您覆盖default_settings.tools.progress_bar,最后一个progress_bar附加到所有元素。