Question

我有一个jQuery插件，它遵循docs.jQuery.com中的插件/创作示例，我无法弄清楚如何为插件应用的每个元素保留唯一设置。页面上有两个元素，每个元素都分别应用了插件。

到目前为止，这是我的代码：

(function( $ ) {

/* Default settings */
var defaults = {
    id: null,
    properties: null,
    container: '.comp-settings', /* override for .retail or .distressed */
    priceLabel: '.comp-section-header span',
    slide: slideCallback,
    minRange: 100000
};

/* Some public here: $.compSlider('method', options) */
var methods = {
    init: function( options ) {

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

        return this.each(function() {
            $(this).slider( settings );
        });

    }
}

/* Some methods here */
function opt( name ) {
    return settings[ name ];
}

/* Plugin namespace */
$.fn.compSlider = function( method ) {
    // Method calling logic
    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 if ( typeof method === 'string' ) {
        return this.slider( method, Array.prototype.slice.call( arguments, 1 ) );
    }
};

})( jQuery )

的问题：

插件功能
如果我将设置变量存储在$（this）.data（'settings'）中，我仍然无法从'opt'函数访问$（this）.data（'settings'）因为“this”isn'元素（我相信它是DOM窗口。）

感谢任何帮助。

Answer 1

您无法访问compSlider函数中的设置，因为在您的示例中，它们在init()中定义，使其成为该函数的本地。如果您在范围内移动了声明：

$.fn.compSlider = function( method, options ) {
    var settings = $.extend( {}, defaults, options );
};

然后你就可以在那里访问它了。或者只是在compSlider中定义它（var settings;）并删除var中的init()就足够了。

更新

回复你的评论，是的，对不起，忘了问题＃2。实际上，您将无法访问每个插件对象的设置，因为您无法在范围内“向下”。换句话说，您无法从该函数外部访问函数的局部变量。这就是compSlider函数本地的设置（如果使用我提出的结构），就opt()函数而言，它们的范围较小。

当然，你可以随时进入范围。为此，您可以在插件的全局空间中设置一个变量，用于存储对所有创建对象的引用。

var compSliderObjects = [];

$.fn.compSlider = function( method, options ) {
    //store objects in compSliderObjects
};

但是，这只是一个想法，您仍然需要弄清楚如何访问compSliderObjects并提取正确的设置。每个对象都有唯一的ID吗？如果是这样，则为一组对象（{id: 2, settings: data}）。如果没有，您需要弄清楚如何唯一地识别它们并从阵列中拉出它们。

另外，您真的需要在全球范围内访问它们吗？只需调用对象并获取设置（如小提琴中所示），工作和代码就更少了。

基于插件/创作文章的插件的jQuery范围设置

1 个答案: