如何在JS中重新定义对象方法？

Question

我想重载插件的方法。

这是我使用的插件。 http://www.owlgraphic.com/owlcarousel/owl-carousel/owl.carousel.js

该库包含以下方法：

 updateControls : function () {
            var base = this;
            base.updatePagination();
            base.checkNavigation();
            if (base.owlControls) {
                if (base.options.items >= base.itemsAmount) {
                    base.owlControls.hide();
                } else {
                    base.owlControls.show();
                }
            }
        },

这是我的方法重载脚本：

jQuery(document).ready(function($){
            $.fn.owlCarousel = $.extend($.fn.owlCarousel, {
                updateControls:function()
                {
                    console.log("!!");
                    var base = this;
                    base.updatePagination();
                    base.checkNavigation();
                    if (base.owlControls) {
                        base.owlControls.show();
                        base.owlControls.show();
                    }
                }
            });
        })

console.log("!!"); 似乎没有被叫-我在做什么错？

Answer 1

在这种情况下，似乎owlCarousel的初始化owlCarousel不接受覆盖updateControls内部函数的选项。 您可能需要修改库以接受（并使用）对updateControls函数的替代。

这种编辑的一个示例是修改库中的init函数，尽管我建议使用options对象来覆盖该函数。

var Carousel = {
    init : function (options, el) {
        var base = this;

        base.$elem = $(el);
        base.options = $.extend({}, $.fn.owlCarousel.options, base.$elem.data(), options);

        base.userOptions = options;

        // check for override in options of updateControls function
        if (typeof base.userOptions.updateControls == "function") base.updateControls = base.userOptions.updateControls;

        base.loadContent();
    }

就像在第二个代码示例中所做的那样，此修改后的init函数将允许您指定updateControls函数。