zoukankan      html  css  js  c++  java
  • Bootstrap popover源码分析

    /* ========================================================================
     * Bootstrap: popover.js v3.3.7
     * http://getbootstrap.com/javascript/#popovers
     * ========================================================================
     * Copyright 2011-2016 Twitter, Inc.
     * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
     * ======================================================================== */
    
    
    +function ($) {
      'use strict';
    
      // POPOVER PUBLIC CLASS DEFINITION
      // ===============================
    
      var Popover = function (element, options) {
        this.init('popover', element, options)
      }
    
      if (!$.fn.tooltip) throw new Error('Popover requires tooltip.js')
    
      Popover.VERSION  = '3.3.7'
    
      Popover.DEFAULTS = $.extend({}, $.fn.tooltip.Constructor.DEFAULTS, {//把默认trigger条件改为click,默认模板也改成现在需要的。
        placement: 'right',
        trigger: 'click',
        content: '',
        template: '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
      })
    
    
      // NOTE: POPOVER EXTENDS tooltip.js
      // ================================
    
      Popover.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype)//把原型里的方法都继承过来,
    
      Popover.prototype.constructor = Popover
    
      Popover.prototype.getDefaults = function () {//因为继承的tootle里面还是原来的,现在改成Popover.DEFAULTS
        return Popover.DEFAULTS
      }
    
      Popover.prototype.setContent = function () {//这个是把模板填充数据的方法,当然需要修改成Popover独有的
        var $tip    = this.tip()
        var title   = this.getTitle()
        var content = this.getContent()
    
        $tip.find('.popover-title')[this.options.html ? 'html' : 'text'](title)
        $tip.find('.popover-content').children().detach().end()[ // we use append for html objects to maintain js events
          this.options.html ? (typeof content == 'string' ? 'html' : 'append') : 'text'
        ](content)
    
        $tip.removeClass('fade top bottom left right in')
    
        // IE8 doesn't accept hiding via the `:empty` pseudo selector, we have to do
        // this manually by checking the contents.
        if (!$tip.find('.popover-title').html()) $tip.find('.popover-title').hide()
      }
    
      Popover.prototype.hasContent = function () {//一句话,把你的换成我的
        return this.getTitle() || this.getContent()
      }
    
      Popover.prototype.getContent = function () {
        var $e = this.$element
        var o  = this.options
    
        return $e.attr('data-content')
          || (typeof o.content == 'function' ?
                o.content.call($e[0]) :
                o.content)
      }
    
      Popover.prototype.arrow = function () {
        return (this.$arrow = this.$arrow || this.tip().find('.arrow'))
      }
    
    
      // POPOVER PLUGIN DEFINITION
      // =========================
    
      function Plugin(option) {
        return this.each(function () {
          var $this   = $(this)
          var data    = $this.data('bs.popover')
          var options = typeof option == 'object' && option
    
          if (!data && /destroy|hide/.test(option)) return
          if (!data) $this.data('bs.popover', (data = new Popover(this, options)))
          if (typeof option == 'string') data[option]()
        })
      }
    
      var old = $.fn.popover
    
      $.fn.popover             = Plugin
      $.fn.popover.Constructor = Popover
    
    
      // POPOVER NO CONFLICT
      // ===================
    
      $.fn.popover.noConflict = function () {
        $.fn.popover = old
        return this
      }
    
    }(jQuery);
  • 相关阅读:
    nodejs/REPL环境命令行操作命令
    C++ Primer第五版学习笔记七 类简介(编译用到C++11特性,编译命令需要加-std=c++11参数,break结束while)
    C++ Primer第五版学习笔记六 控制流之if语句
    C++ Primer第五版学习笔记五 控制流之读取数量不定的输入数据
    C++ Primer第五版学习笔记四 控制流之while,for语句
    C++ Primer第五版学习笔记三 C++中的注释
    C++ Primer第五版学习笔记二 初识输入输出
    C++ Primer第五版学习笔记一 一个简单的C++程序
    QT学习笔记二 窗口和子部件
    QT学习笔记一 初识QT Creator 新建一个Dialog窗口
  • 原文地址:https://www.cnblogs.com/xiaobie123/p/5997617.html
Copyright © 2011-2022 走看看