如何在jquery插件中为变量属性赋值

如何在jquery插件中为变量属性赋值,jquery,jquery-plugins,variable-assignment,Jquery,Jquery Plugins,Variable Assignment,如何从插件外部为以下插件“defaults”对象的“extraParams”属性赋值 (function ($) { jQuery.fn.jScroller = function (store, parameters) { var defaults = { //numberOfRowsToRetrieve: 10, onSuccessCallback: function (row, container) { }, onErrorCallba

如何从插件外部为以下插件“defaults”对象的“extraParams”属性赋值

(function ($) {
jQuery.fn.jScroller = function (store, parameters) {
    var defaults = {
        //numberOfRowsToRetrieve: 10,
        onSuccessCallback: function (row, container) { },
        onErrorCallback: function (thrownError) { window.alert('An error occurred while trying to retrive data from store'); },
        onTimeOutCallback: function () { },
        timeOut: 3 * 1000,
        autoIncreaseTimeOut: 1000,
        retryOnTimeOut: false,
        loadingButtonText: 'Loading...',
        loadMoreButtonText: 'Load more',
        fullListText: 'There is no more items to show',
        routValues: null
我尝试了此操作,但导致了一个错误:

$.jScroller.defaults.extraParams = val;
从手册中:

对于提供许多选项的更复杂和可自定义的插件,最佳做法是在调用插件时使用可扩展的默认设置(使用
$.extend
)。因此,您可以使用一个参数来调用插件,而不是使用大量参数来调用插件,该参数是要覆盖的设置的对象文本


在这个例子中,手册展示了如何通过传递额外的参数来调用插件,如果您愿意,可以覆盖默认参数(比如
{location:left}
)。

这里有两个非常简单的插件。两者都没有设置任何默认值,但都响应传递给它们的选项。一个使用
$.fn.plugin.defaults
来设置默认值,另一个使用本地
var
,正如您所开始的那样。在某种程度上,这是一个个人喜好的问题,同时也是插件设置默认值的复杂程度

请注意,选项是通过两种不同的方式在插件2上进行外部设置的

演示:


如果“extend”方法中没有提到“defaults”,它如何知道替换“location”和“bakcground color”中的值?这段代码正确吗?代码取自一个示例,它不是基于您的代码(很抱歉,我在工作场所,无法调整它,没有时间),但应该很容易用您的插件实现。我知道它不正确-这是一个与您的示例相关的一般性问题。您可以再读一遍吗?只需将“工具提示”更改为您的函数,在默认值上使用$.extend即可。调用函数时,会传递一个设置对象,如
{extraParams:“etc.”
tnks。通过你的例子,我发现我可以从外部为默认值赋值。为什么我不能在我的代码中输入?除非你像我在插件2中那样设置代码。不同之处在于
var
只能在函数内部访问。看看我的
$.extend
。它们是不同的。写$.extend很容易,但是看到这两个方法并排可能会有所帮助
  $.fn.tooltip = function( options ) {  

    // Create some defaults, extending them with any options that were provided
    var settings = $.extend( {
      'location'         : 'top',
      'background-color' : 'blue'
    }, options);

    return this.each(function() {        

      // Tooltip plugin code here

    });

  };
})( jQuery );
(function($) {
    $.fn.plugin_1 = function(options) {
        var defaults = {}; /* merge the options into defaults*/
        var opts = $.extend({}, defaults, options);

        return this.each(function() {
            if (opts.green) {
                $(this).css('background', 'green')
            }
        });
    }
})(jQuery);
(function($) {
    $.fn.plugin_2 = function(options) { /* merge the options into defaults*/
        var opts = $.extend({}, $.fn.plugin_2.defaults, options);

        return this.each(function() {
            if (opts.big) {
                $(this).css('font-size', '30px')
            }
            if (opts.color) {
                $(this).css('color', 'white')
            }
        });
    }

    $.fn.plugin_2.defaults = {};

})(jQuery)


$(function() {
    $.fn.plugin_2.defaults.big = true;
    $('div').plugin_2({color:true}).plugin_1({green: true  })

})