Question

让我们假设自己创建一个jQuery小部件。我们正在使用jquery.ui.widget来完成任务。我们想要创建一个带红色边框的简单方形div。好吧，让它成为我们未来任何扩展小部件的框架。

(function ($) {
    $.widget('ns.redsquare', {
        _create: function () {
            var elem = this.element;

            elem.css({
                width: 100,
                height: 100,
                border: 'solid 1px red'
            });

            $(this.element).appendTo('body');
        }

        // probably a lot of other functionality follows
    }

    $(document).ready(function () {
        $('<div/>').redsquare();
    });
})(jQuery);

所以，未来来了。我们希望扩展我们的红色方块，使其包含带绿色边框的平方div。当然，孩子应该比父母小一点。问题是“如何扩展小部件以包含新功能？”。也就是说，我们如何扩展（不更改的源代码）我们的红色方块以帮助我们的绿色方块父？红场的代码应保持不变;绿色方块应该有自己的代码，但包含红色方块可能提供的所有功能。

注意：此处提供的小部件示例不是真实的;这只是我的另一个不幸的例子。

Answer 1

使用解释here的子类化过程。

如何扩展小部件以包含新功能？

1 个答案: