Создайте параметры для каждого объекта плагина jquery

Question

Мне снова нужна ваша помощь:)

Я пытаюсь сделать плагин со спецификациями jQuery. Итак, я начал читать это: http://docs.jquery.com/Plugins/Authoring

Документ классный и дает хорошие шаблоны для подражания.

Но у меня проблема с моим плагином.

Мой плагин добавляет div и привязывает некоторые события к различным функциям.

Иногда мне нужно получить доступ к опциям var, но ... проблема в том, что если я сделаю глобальную опцию var, то примут опции, созданные последним объектом.

И если я добавлю его в метод init, я не смогу использовать его в других действиях.

Мне нужно, чтобы каждый новый объект мог получить доступ только к своей собственной установленной опции.

(function( $ ) {
//plugin methods
var methods = {
    init : function( options ) {


        //default options
        var opt = $.extend({
            'id'            : 'test',
            'title'         : 'Test window',
            'type'          : 'normal',
            'text'          : 'test test! <br/> 123',
            'shines'        : '',
            'head_shines'   : '',
            'body_shines'   : '',
            'bottom_bar'    : true
        }, options);

        //shine or not shine? that's the matter
        if (opt.shines != '') {
            opt.shines = "shiny";
            opt.head_shines = " shine_head";
            opt.body_shines = " shine_body";
        }

        //maintaining Chainability
        return this.each(function() {
            var $this = $(this); // $this is now JQuery object

            //creating the bottom bar
            if (opt.bottom_bar == true && $("#bottom_bar").length == 0) {
                $this.append('<div id="bottom_bar"></div>');
            }
            //creating the new window
            $this.append("<div style='display: none;' class='window "+opt.shines+"' id='"+opt.id+"'>...boring html...</div>");

            //append new window to the bar
            $("#bottom_bar").append("<div style='display: none' class='section' id='s_"+opt.id+"'>"+opt.title+"</div>");

            //get a object of the window to interact with
            var $window = $("#"+opt.id);

            //show the windows
            $window.fadeIn().draggable();
            $("#s_"+opt.id).fadeIn();

            //attach the events to the windows
            $window.find('.close').one('click.ventana', methods.close);

            $window.find('.max').on('click.ventana', methods.maximize);

            $window.find('.min').on('click.ventana', methods.minimize);
            $("#s_"+opt.id).on('click.ventana', methods.minimizeBar);
        });

    },
    close : function() {},
    maximize : function() {}, //i want acces my opts here!
    minimize : function() {},
    minimizeBar: function() {} //or here... etc
}; //end methods

//creating the plugin
$.fn.ventana = function( method ) {
    if ( methods[method] ) { //if we call a method...
        return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ) );
    } else if ( typeof method == 'object' || !method ) { //if not, we use init
        return methods.init.apply( this, arguments);
    } else { //method don't exists (console error)
        $.error( 'Method ' + method + ' does not exists in jQuery.ventana');
    }
};

}) ( jQuery );

Проблема в том, если я поставлю первый комментарий:

//plugin methods

это:

//globals define
var opt;

Я получаю только последний объект ...

Пример создания новых окон

$('body').ventana( {
    'id'    : 'master',
    'title' : 'Afegir Finestres',
    'text'  : 'test'
});
$('body').ventana( {
    'id'    : 'master1',
    'title' : 'Afegir Finestres1',
});

Я просто получу опции master1 в обоих объектах

Answer 1

Вы можете использовать data для хранения объекта параметров, который будет получен позже.

// store it
$this.data("options", opt);

// ...

// use it later
var opt = $this.data("options");