Jquery plugins 为jquery插件的每个对象创建选项

我再次需要你的帮助：）

我正在尝试用jQuery规范做一个插件。 所以我开始读这篇文章：

该文档很酷，提供了很好的模式可供遵循

但是我的插件有问题

我的插件附加了一个div，并将一些事件绑定到不同的功能上

有时我需要根据选项var进行调整，但是。。。问题是，如果我执行opt-var-global，它将使用最后创建的对象选项

如果我把它放在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 );

这：

我只得到最后一个对象选项

创建新窗口的示例

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

---

我只需要在两个对象中获取master1选项

您可以使用

数据

存储选项对象，以便稍后检索

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

// ...

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

---

好啊真的谢谢！我知道了。数据，但似乎我不明白我到底在做什么。我只是想澄清一下。因为我总是在创建新窗口时使用$window变量，所以我需要将opt设置为$window变量，而不是$this。但非常感谢您的帮助：）始终将其附加到

窗口

基本上与使用全局变量的效果相同。一般来说，你会将它附加到你调用插件的任何元素上。我知道，但是$window是$this中新的对象。。。只是有点不同步不是窗口对象。但是你解决了我的问题^^^哦，对了，

$window

，而不是“window”。是的，那可能很好。

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

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

// ...

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