プログラミング

【Bootstrap】モーダルが表示されたと思ったらすぐ消える事象が発生したときの対応

あきぞらです。

Bootstrapを使ってフロントを開発していたのですが、問題に遭遇。

モーダルが表示されたと思ったら、すぐに消える事象に遭遇した。

???

1回目、2回目は出したり消したりしても大丈夫なのだが、

3回目くらいに表示させようとすると「ヒュッ」と消えて、グレーの背景だけが残る。笑

何かのバグだと思ってコンソールを開いてみるも、何もエラーは表示されず。

調べるとすぐに解決したので、解決方法を書いていきます。

原因

真因は分からないままだが、原因はどうやら「モーダルプラグインが2回読み込まれている」ことのようだ。

ググったサイト

対策

というわけで、Bootstrap系のモジュールが重複して読み込まれていないかを確認してみる。

探してみると怪しいものが。

https://cdnjs.cloudflare.com/ajax/libs/bootstrap.native/2.0.27/bootstrap-native-v4.min.js
http://fullcalendar.io/js/fullcalendar-2.1.1/lib/moment.min.js
http://fullcalendar.io/js/fullcalendar-2.1.1/lib/jquery.min.js
http://fullcalendar.io/js/fullcalendar-2.1.1/lib/jquery-ui.custom.min.js
https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js

一番最後のやつがどうも怪しい・・。

使ってなさそうだったので削除してみると、解消された!

Bootstrapはむやみにインクルードしちゃいかん。

-プログラミング
-,

Copyright© あきぞらブログ , 2020 All Rights Reserved Powered by AFFINGER5.