global or local variables in a jquery-plugin

前端 未结 2 1775
耶瑟儿~
耶瑟儿~ 2021-02-04 18:02

How is it possible to give a jquery-plugin individual local variables, that are accessable in different plugin-functions?

My script shows an alert with the content \'123

2条回答
  •  无人共我
    2021-02-04 18:53

    All you need is here :

    // jQuery Plugin Boilerplate
    // A boilerplate for jumpstarting jQuery plugins development
    // version 1.1, May 14th, 2011
    // by Stefan Gabos
    
    // remember to change every instance of "pluginName" to the name of your plugin!
    (function($) {
    
        // here we go!
        $.pluginName = function(element, options) {
    
            // plugin's default options
            // this is private property and is  accessible only from inside the plugin
            var defaults = {
    
                foo: 'bar',
    
                // if your plugin is event-driven, you may provide callback capabilities for its events.
                // execute these functions before or after events of your plugin, so that users may customize
                // those particular events without changing the plugin's code
                onFoo: function() {}
    
            }
    
            // to avoid confusions, use "plugin" to reference the current instance of the object
            var plugin = this;
    
            // this will hold the merged default, and user-provided options
            // plugin's properties will be available through this object like:
            // plugin.settings.propertyName from inside the plugin or
            // element.data('pluginName').settings.propertyName from outside the plugin, where "element" is the
            // element the plugin is attached to;
            plugin.settings = {}
    
            var $element = $(element),  // reference to the jQuery version of DOM element the plugin is attached to
                 element = element;        // reference to the actual DOM element
    
            // the "constructor" method that gets called when the object is created
            plugin.init = function() {
    
                // the plugin's final properties are the merged default and user-provided options (if any)
                plugin.settings = $.extend({}, defaults, options);
    
                // code goes here
    
            }
    
            // public methods
            // these methods can be called like:
            // plugin.methodName(arg1, arg2, ... argn) from inside the plugin or
            // element.data('pluginName').publicMethod(arg1, arg2, ... argn) from outside the plugin, where "element"
            // is the element the plugin is attached to;
    
            // a public method. for demonstration purposes only - remove it!
            plugin.foo_public_method = function() {
    
                // code goes here
    
            }
    
            // private methods
            // these methods can be called only from inside the plugin like:
            // methodName(arg1, arg2, ... argn)
    
            // a private method. for demonstration purposes only - remove it!
            var foo_private_method = function() {
    
                // code goes here
    
            }
    
            // fire up the plugin!
            // call the "constructor" method
            plugin.init();
    
        }
    
        // add the plugin to the jQuery.fn object
        $.fn.pluginName = function(options) {
    
            // iterate through the DOM elements we are attaching the plugin to
            return this.each(function() {
    
                // if plugin has not already been attached to the element
                if (undefined == $(this).data('pluginName')) {
    
                    // create a new instance of the plugin
                    // pass the DOM element and the user-provided options as arguments
                    var plugin = new $.pluginName(this, options);
    
                    // in the jQuery version of the element
                    // store a reference to the plugin object
                    // you can later access the plugin and its methods and properties like
                    // element.data('pluginName').publicMethod(arg1, arg2, ... argn) or
                    // element.data('pluginName').settings.propertyName
                    $(this).data('pluginName', plugin);
    
                }
    
            });
    
        }
    
    })(jQuery);
    

    Source : http://stefangabos.ro/jquery/jquery-plugin-boilerplate-revisited/

提交回复
热议问题