この参照を見ることができますが、このリンクが削除されている場合は、この説明を読んでください。
JavaScriptの1行でid myModalのモーダルを呼び出します。
$('#myModal').modal(options)
オプション
オプションは、データ属性またはJavaScriptを介して渡すことができます。データ属性の場合、data-backdrop = ""のように、オプション名をdata-に追加します。
|-----------|-------------|--------|---------------------------------------------|
| Name | Type | Default| Description |
|-----------|-------------|--------|---------------------------------------------|
| backdrop | boolean or | true | Includes a modal-backdrop element. |
| | the string | | Alternatively, specify static for a |
| | 'static' | | backdrop which doesn't close the modal |
| | | | on click. |
| | | | |
| keyboard | boolean | true | Closes the modal when escape key is pressed.|
| | | | |
| focus | boolean | true | Puts the focus on the modal when initialized|
| | | | |
| show | boolean | true | Shows the modal when initialized. |
|-----------|-------------|--------|---------------------------------------------|
方法
非同期メソッドと遷移
すべてのAPIメソッドは非同期であり、遷移を開始します。トランジションが開始するとすぐに、それが終了する前に、呼び出し元に戻ります。また、移行中のコンポーネントのメソッド呼び出しは無視されます。
詳細については、JavaScriptのドキュメントを参照してください。
.modal(オプション)
コンテンツをモーダルとしてアクティブ化します。オプションのオプションオブジェクトを受け入れます。
$('#myModal').modal({
keyboard: false
})
.modal( 'toggle')
モーダルを手動で切り替えます。モーダルが実際に表示または非表示になる前(つまり、showned.bs.modalまたはhidden.bs.modalイベントが発生する前)に呼び出し元に戻ります。
$('#myModal').modal('toggle')
.modal( 'show')
手動でモーダルを開きます。モーダルが実際に表示される前(つまり、showned.bs.modalイベントが発生する前)に呼び出し元に戻ります。
$('#myModal').modal('show')
.modal( 'hide')
モーダルを手動で非表示にします。モーダルが実際に非表示になる前(つまり、hidden.bs.modalイベントが発生する前)に呼び出し元に戻ります。
$('#myModal').modal('hide')
.modal( 'handleUpdate')
モーダルが開いている間に高さが変化する場合(つまり、スクロールバーが表示される場合)は、モーダルの位置を手動で再調整します。
$('#myModal').modal('handleUpdate')
.modal( 'dispose')
要素のモーダルを破棄します。
イベント
ブートストラップのモーダルクラスは、モーダル機能にフックするためのいくつかのイベントを公開します。すべてのモーダルイベントは、モーダル自体(つまり、**)で発生します。タイプ説明
|----------------|--------------------------------------------------------------|
| Event Type | Description |
|----------------|--------------------------------------------------------------|
| show.bs.modal | This event fires immediately when the **show** instance |
| | method is called. If caused by a click, the clicked element |
| | is available as the **relatedTarget** property of the event. |
| | |
| shown.bs.modal | This event is fired when the modal has been made visible to |
| | the user (will wait for CSS transitions to complete). If |
| | caused by a click, the clicked element is available as the |
| | **relatedTarget** property of the event. |
| | |
| hide.bs.modal | This event is fired immediately when the **hide** instance |
| | method has been called. |
| | |
| hidden.bs.modal| This event is fired when the modal has finished being hidden |
| | from the user (will wait for CSS transitions to complete). |
|----------------|--------------------------------------------------------------|
$('#myModal').on('hidden.bs.modal', function (e) {
// do something...
})
$("#yourModal").modal()
またはでモーダルを初期化していますか$('.modal').modal()
?