【JavaScript】モーダルが閉じられた時に処理を動かしたい！!
Bootstrap/jQuery使用しているときにモーダルを表示してから閉じられた際に処理を動かしたいという時はありませんか？
簡単です！
では見ていきましょう！
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#modal">
モーダルを開く
</button>
<!-- モーダル -->
<div class="modal fade" id="modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span>×</span></button>
<h4 class="modal-title">モーダルのタイトル</h4>
</div>
<div class="modal-body">
<span>これはサンプルのモーダルです</span><br>
<span>OKか閉じるを選択してください</span>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-light" data-dismiss="modal">OK</button>
<button type="button" class="btn btn-light" data-dismiss="modal">閉じる</button>
</div>
</div>
</div>
</div>以下でモーダルが閉じられた際の動作を設定します
$('#modal').on('hidden.bs.modal', function () {
alert('無事にモーダルは閉じました');
})いかがでしたでしょうか？
モーダルは警告やエラーメッセージをユーザに伝えるためによく使用されます
モーダルの使い手になりましょう！（笑）
是非フォローしてください
最新の情報をお伝えします
