2012-04-03 9 views
6

अच्छा jQuery Plugins/Authoring निर्देश मैं एक छोटे से सवालjQuery - प्लगइन विकल्प डिफ़ॉल्ट का विस्तार()

(function($){ 

    // Default Settings 
    var settings = { 
    var1: 50 
    , var2: 100 
    }; 

    var methods = { 
    init : function (options) { 
     console.log(settings); 
     settings = $.extend(options, settings); // Overwrite settings 
     console.log(settings); 
     return this; 
    } 
    , other_func: function() { 
     return this; 
    } 
    }; 

    $.fn.my_plugin = 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.my_plugin'); 
    }  
    }; 

})(jQuery); 

है, तो मैं

>>> $('my_element').my_plugin({var3: 60}) 
Before Object { var2=100, var1=50} 
After Object { var3=60, var2=100, var1=50} 
[ my_element ] 

>>> $('my_element').my_plugin({var1: 60}) 
Before Object { var1=50, var2=100} 
After Object { var1=50, var2=100} 
[ my_element ] 

करना क्यों मेरी var1 ओवरराइड नहीं है के बाद?

उत्तर

19

आप अपने $.extend में बहस के क्रम को मिलाया (लक्ष्य पहले होना चाहिए), यह होना चाहिए:

settings = $.extend(settings, options); 

this fiddle और docs for $.extend()

करने के लिए देखें भ्रम से बचें आप अपनी सेटिंग्स को अपने डिफ़ॉल्ट के साथ भी बढ़ा सकते हैं:

methods.init = function(options){ 

    var settings = $.extend({ 
    key1: 'default value for key 1', 
    key2: 'default value for key 2' 
    }, options); // <- if no/undefined options are passed extend will simply return the defaults 

    //here goes the rest 

}; 
+0

वास्तव में यह आदेश था, आपको बहुत धन्यवाद –

+1

इससे मुझे मेरी [पहली] (https://github.com/Glideh/jquery.particles.burst) githubbed jquery प्लगइन बनाने में मदद मिली :) –

4

आप अपने डिफ़ॉल्ट ओवरराइट कर रहे हैं। Init विधि के भीतर सेटिंग्स को स्टोर करने के लिए एक नया चर बनाने का प्रयास करें।

var defaults = { 
    var1: 50 
    , var2: 100 
    }; 

    var methods = { 
    init : function (options) { 
     console.log(defaults); 
     var settings = $.extend({},defaults,options || {}); 
     console.log(settings); 
     $(this).data("myPluginSettings",settings); 
     return this; 
    } 
    , other_func: function() { 
     console.log(this.data("myPluginSettings")); 
     return this; 
    } 
    }; 
+0

मैंने पैरामीटर को उलट दिया। धन्यवाद –

संबंधित मुद्दे