Bootstrap data-toggle data-target modal實現彈窗可用於編輯，添加數據用，popover實現告警信息或者按鈕事件後狀態的提示,tooltips提示

前提是要引入bootstrap.min.js

1.先定義一個按鈕  data-toggle：以什麼事件觸發，如modal,popover,tooltips等； data-target：事件的目標；
<button type="button"  data-toggle="modal" data-target="#modal">
   <i class="fa fa-user-plus m-r-sm text-md"></i>添加 </button> 

2.定義事件的目標 即data-target的屬性值  這個是#modal 那就是id="modal"的元素

<div class="modal fade" tabindex="-1" role="dialog" id="modal">
　　.......內容
</div>

data-toggle="modal"的彈框效果

 

data-toggle="popover"通常應用點擊事件後，好比請求後返回的狀態在該點擊事件冒泡顯示其狀態是否成功的提示，具體參考如下連接----菜鳥教程

http://www.runoob.com/try/try.php?filename=bootstrap3-plugin-popover

data-toggle="tooltips" 是鼠標懸停在對應目標上能夠作提示   這樣咱們能夠對頁面顯示文字當鼠標懸停在上面時作詳細的解釋。

例子：   http://www.runoob.com/try/try2.php?filename=bootstrap3-plugin-tooltip