如何扩展使用匿名函数创建的对象原型

Question

我正在使用“ scrollPagination” javascript进行ajax分页。 这是一个代码：

(function( $ ){
    $.fn.scrollFeedPagination = function(options) {
        var opts = $.extend($.fn.scrollFeedPagination.defaults, options);  
        var target = opts.scrollTarget;
        if (target == null){
            target = obj; 
        }
        opts.scrollTarget = target;

        return this.each(function() {
            $.fn.scrollFeedPagination.init($(this), opts);
        });
    };
    $.fn.stopScrollPagination = function(){
        return this.each(function() {
            $(this).attr('scrollPagination', 'disabled');
        });
    };
    $.fn.scrollFeedPagination.loadContent = function(obj, opts){
        console.log(opts);
        var target = opts.scrollTarget;
        var mayLoadContent = ($(target)[0].scrollHeight - $(target).scrollTop()) == $(target).height();
        if (mayLoadContent){
            if (opts.beforeLoad != null){
                opts.beforeLoad(); 
            }
            $(obj).children().attr('rel', 'loaded');
            $.ajax({
                type: 'POST',
                url: opts.contentPage,
                data: opts.contentData,
                success: function(data){
                    console.log(data);
                    console.log(1);
                    var selector = target.selector;
                    var response = $(data).find(selector).children();
                    $(obj).append(response);
                    var objectsRendered = $(obj).children('[rel!=loaded]');
                    if (opts.afterLoad != null){
                        opts.afterLoad(objectsRendered);    
                    }
                },
                dataType: 'html'
            });
        }
    };

    $.fn.scrollFeedPagination.init = function(obj, opts){
        var target = opts.scrollTarget;

        $(obj).attr('scrollPagination', 'enabled');
        $(target).scroll(function(event){
            if ($(obj).attr('scrollPagination') == 'enabled'){
                $.fn.scrollFeedPagination.loadContent(obj, opts);       
            }
            else {
                event.stopPropagation();    
            }
        });
        $.fn.scrollFeedPagination.loadContent(obj, opts);
    };
    $.fn.scrollFeedPagination.defaults = {
        'contentPage' : null,
        'contentData' : {},
        'beforeLoad': null,
        'afterLoad': null   ,
        'scrollTarget': null,
        'heightOffset': 0         
    };  
})( jQuery );

当我在一个节点上对它进行初始化时，它工作正常。 但是两个节点相互干扰：

例：

node1.pagination({
'contentPage': ajaxurl,
    'contentData': {
         action: 'chat_pagination',
         'last_time' : last_time,
    },
    'scrollTarget': node1, 
    'beforeLoad': function() {},
    'afterLoad': function(elementsLoaded) {
        last_time = node1.children('div').last().data('last-id');
    }
});

它可以工作，但是一旦我初始化另一个

node2.pagination({
'contentPage': ajaxurl,
    'contentData': {
         action: 'feeds_pagination',
         'last_time' : last_time,
    },
    'scrollTarget': node2, 
    'beforeLoad': function() {},
    'afterLoad': function(elementsLoaded) {
        last_time = node2.children('div').last().data('last-id');
    }
});

现在，node1使用node2的last_time更新，并且ajax动作也为“ feeds_pagination”。

现在要解决此问题，我需要有两个scrollFeedPagination（）实例； 这样的语法有可能扩展吗？

Answer 1

 var opts = $.extend($.fn.scrollFeedPagination.defaults, options); 

请注意， $.extend的第一个参数是要扩展的对象（具有其余参数中对象的属性），并且也是return ed的函数的结果。 所以你基本上是在设定

var opts = $.fn.scrollFeedPagination.defaults
// extend it then:
$.extend(opts, options);

如您所见，两个opts对象实际上都是同一对象，第二次对其进行扩展将覆盖第一个配置。 而是从一个新的空对象开始，并首先使用默认值然后使用options参数对其进行扩展：

var opts = $.extend({}, $.fn.scrollFeedPagination.defaults, options);