如何使用动态类 data-attr 扩展 Bootstrap 3 弹出框/工具提示



如何在引导核心文件之外添加以下热修复程序?

这个问题之前已经发布过,并且热修复程序确实像一个魅力。但它需要编辑核心文件。这里!

在 Tooltip.prototype.show 函数中:

  $tip
    .detach()
    .css({ top: 0, left: 0, display: 'block' })
    .addClass(placement)
添加

下面的添加类就像一个魅力:

  .addClass(this.$element.attr("data-class"))

因此,现在每当您将data-class添加到弹出框调用时,它都会将属性添加到<div class="popover">div。

缺点是您必须编辑核心文件才能实现此目的。我只是稍微精通jQuery,这让我绞尽脑汁,但我认为一定有一种方法可以将.addClass()作为工具提示原型的扩展。也许使用 .extend()?

    !function($){   
        $.extend($.fn.tooltip.Constructor.DEFAULTS,{
            dataClass: false
        }); 
        var Tooltip = $.fn.tooltip.Constructor;
            _show = Tooltip.prototype.show;
        Tooltip.prototype.show = function (){
            _show.apply(this,Array.prototype.slice.apply(arguments));
            if (this.options.dataClass!=="undefined" && this.options.dataClass){
                var that = this;
                var $tip = this.tip();
                if (this.$element.attr("data-class") !== undefined)
                    $tip.addClass(this.$element.attr("data-class"));
            }
        };
    }(jQuery);

最新更新