多个实例覆盖值

Question

我创建了一个非常简单的jQuery徽标旋转插件，但第二个实例从第一个实例覆盖了我的vlaues。

(function($){ 
    $.fn.clientRoll = function(settings) { 

     var config = { 
     'speed': 10000, 
     'items': 3 
    }; 

    var settings = $.extend(config, settings); 

    var itemRoll = $(this); 

    var childHeight = $(itemRoll).children().eq(0).outerHeight(); 
    $(itemRoll).height(childHeight); 

    $.fn.clientRollLeft = function() { 
    var logoWidth = $(this).children(':first').innerWidth(); 

    $(this).children(':first').not(':animated').clone().css({ opacity: 0, marginLeft: "" }).insertAfter($(this).children(':last'))/*.delay(200).animate({ opacity: 1 })*/; 

    $(this).children(':first').not(':animated').animate({ 
     marginLeft: -(logoWidth), opacity: 0 }, function() { 
     $(this).remove(); 
    }); 

    $(this).children(":gt(" + (config.items - 1) + ")").css({ opacity: 0, background: "#FF0" }).delay(300).animate({ opacity: 1, background: "#FFF" }); 
} 

}; 
})(jQuery); 

所以每当我写的是这样的： $（ “客户端卷DIV> UL”）clientRoll。（{ '速度'：2000年， '项目'：4}）; $（ “文章辊”。）clientRoll（{ '项'：3， '速度'：1500}）。

从第一实例中的“项目”值是由从第二个实例的值3覆盖。

Answer 1

extend method扩展了您作为第一个参数传递的对象，并将其返回。

提供一个新的对象，如果你想两个对象合并成一个新的第一个参数：

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