bootstrap data-toggle 沖突（如何同時使用tooltip工具提示和modal模態框）

https://blog.csdn.net/weixin_44555663/article/details/105075422

在做web課后作業的時候遇到了一個問題，記錄一下。

1.button中使用模態框

<button type="button" data-placement="bottom" title="Click here to log in" 
             class="btn btn-primary tooltip-toggle" data-toggle="modal"
             data-target="#exampleModal" data-whatever="@mdo">
             Login
             </button>

data-toggle=“modal”

2.js實現tooltip
1）在button中依舊寫入data-placement（顯示位置） 和 title（顯示內容）
2）在button的class中添加tooltip-toggle類（任意取名，只要和jQuery 元素選擇器的內容對應即可）
3）在js文件中添加$(’.tooltip-toggle’).tooltip();表示這個類需要實現tooltip的功能==在button中寫入data-toggle=“tooltip”
4）注意一個點：如果是直接在html中寫js，需要將寫在bootstrap和jquery的js文件導入代碼下面

    <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
    <!-- 文件夾導入 -->
    <script src="./js/bootstrap.min.js"></script>
    <script>
        $(function () {
            $('.tooltip-toggle').tooltip();
        });
    </script>

 

————————————————
版權聲明：本文為CSDN博主「余丁」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/weixin_44555663/article/details/105075422