JQuery Plugin Defaults and Options

12,232

The simplest pattern is to extend a default options object. But it does mean that any parameters have to be passed together as an "option" object, eg: myPlugin({variable2:false})

(function($){
   $.fn.myPlugin = function(options){

      var defaults = {
          variable1 : true,
          variable2 : true,
          variable3 : true,
          variable4 : true
      }

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

      if(settings.variable1){
         // do something
      }

      ...
   }
})(jQuery);
Share:
12,232
user582065
Author by

user582065

Updated on June 18, 2022

Comments

  • user582065
    user582065 almost 2 years

    How can I turn the following properties / variables in my plugin into defaults and options that can be set from document ready?

    // plugin js:

    (function($){
       $.fn.myPlugin = function(options){
          var myForm = this;
          myForm.variable1 = true;
          myForm.variable2 = true;
          myForm.variable3 = true;
          myForm.variable4 = true;
    
          ...
    
          if(myForm.variable1){
             // do something
          }
    
          ...
       }
    })(jQuery);
    

    // document ready in page:

    <script type="text/javascript">
       $(document).ready(function() {
          $('#form1').myPlugin();
       });
    </script>
    
  • sics
    sics about 11 years
    if you want this happen recursively in case you have nested options like defaults.foo.bar, use true as the first parameter. eg: $.extend(true, {}, defaults, options) - hopefully this info saves some hours of others