일반적으로 화면에서 버튼을 클릭하면 bootstrap 스타일의 대화상자(modal)를 표시한다.

화면에 구현 방법

· 대화 상자를 팝업하는 버튼 지정
· 팝업 할 대화 상자를 div로 편집하여 스타일 설정

HTML 소스로 설명하기

HTML만으로 다이얼로그를 실현할 수 있다.
・버튼으로 「data-toggle="modal"」 「data-target="#modalId"」밖에 지정하지 않는, 다른 onclick등 지정할 필요가 없다.<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#modalId">
ボタン
</button>
・구체적인 다이얼로그를 설정한다. id는 일치입니다. "class="modal fade""의 CSS 스타일에서 버튼을 클릭하기 전에 숨기고 클릭하면 나타났습니다.<!-- モーダル・ダイアログ -->
<div class="modal fade" id="modalId" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content">
モーダルの内容
</div>
</div>
</div>만약 모달이 표시되면 이벤트가 필요하면 아래의 자바스크립트를 만든다.
$(#modalId).on('shown.bs.modal', function (e) {
// 処理
});
좋은 링크
ht tp // // 보오 tst et al p3. cybe rb.いんふぉ / 그럼 sc 리 pt / 모다 ls - 에어 ts. HTML
h tps : // 보오 tst et p-gui. 코 m / 그럼 sc 리 pt / 모다 ls / 에우 ts

doc:
htps : // 게이 t보오 tst et al p. jp / 도 cs / 4.2 / 갓찐 g-s r d / 인 t 로즈 c 치온 / # % 3 % 82 % B3 % 3 % 83 % 9F % 3 % 83 % A 5 % 3 % 83 % 8B % 3 % 83 % 86 % 3 % 82 % A 3