2011-05-27 43 views
5

我做了一个jQuery插件,它的工作非常好。除了当我在同一页面上有多个实例时,最后一个实例的选项/设置用于两者。默认和多个实例的jquery设置

这是一个精简版...它的长度很抱歉。

(function() { 

    var settings = {}; 
    var defaults = { 
     duration : 1000, 
     easingShow : 'easeOutBounce', 
     easingHide : 'easeOutQuad' 
    }; 

    var methods = { 
     init : function(options) { 

      return this.each(function(n) { 

       settings = $.extend(defaults, options); 

      }); 

     }, 

     show : function() { 

      // settings used here 
     }, 

     hide : function() { 
      // also used here 
     } 
    }; 

    $.fn.expander = function(method) { 

     if (methods[method]) { 
      return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); 
     } else if (typeof method === 'object' || !method) { 
      return methods.init.apply(this, arguments); 
     } else { 
      $.error('Method ' + method + ' does not exist on jQuery.expander'); 
     } 

    }; 

})(jQuery); 

我敢肯定,这是某种名称空间问题,因为我经常会感到困惑。

由于

回答

6

使用

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

从jquery的文档@http://api.jquery.com/jQuery.extend/

 
deep  If true, the merge becomes recursive (aka. deep copy). 
target The object to extend. It will receive the new properties. 
object1 An object containing additional properties to merge in. 
objectN Additional objects containing properties to merge in. 

记住目标对象(第一自变量)将被修改,并且也将从$ .extend()返回。但是,如果我们想保留两个原始对象,我们可以通过传递一个空对象作为目标来实现。

为每个元件具有不同的设置,你可以在使用.data()

检查了工作演示的每个元素将它们存储:http://jsfiddle.net/roberkules/XvKs8/

+0

谢谢,但我想你已经错过了问题。问题不在于我设置设置变量的方式。这是,如果我把它设置在'return this.each(function(){});'部分,那么显示和隐藏功能将无法访问它。但是如果我将它设置在外面,就像我已经完成的那样,每个启用了插件的元素都是相同的。 – ianbarker 2011-05-31 08:14:26

+0

检查演示,应该做你需要的。 – roberkules 2011-05-31 10:56:06

+1

我曾试图避免使用数据(),但我认为这是唯一的方法。 – ianbarker 2011-05-31 14:12:09