現在のスクリーンにダイアログを表示します。
<script>
ons.ready(function() {
ons.createDialog('dialog.html').then(function(dialog) {
dialog.show();
});
});
</script>
<script type="text/ons-template" id="dialog.html">
<ons-dialog cancelable>
...
</ons-dialog>
</script>See the Pen Alert, confirm and prompt dialogs by Onsen & Monaca (@onsen) on CodePen.
| 名前 | 型 / デフォルト値 | 概要 |
|---|---|---|
| var | String | このダイアログを参照するための名前を指定します。 Optional |
| modifier | String | ダイアログの表現を指定します。 Optional |
| cancelable | この属性があると、ダイアログが表示された時に、背景やバックボタンをタップした時にダイアログを閉じます。 Optional | |
| disabled | この属性がある時、ダイアログはdisabled状態になります。 Optional | |
| animation |
String
default |
ダイアログを表示する際のアニメーション名を指定します。"none"もしくは"default"を指定できます。 Optional |
| mask-color |
String
rgba(0, 0, 0, 0.2) |
背景のマスクの色を指定します。"rgba(0, 0, 0, 0.2)"がデフォルト値です。 Optional |
| ons-preshow | Expression | "preshow"イベントが発火された時の挙動を独自に指定できます。 Optional |
| ons-prehide | Expression | "prehide"イベントが発火された時の挙動を独自に指定できます。 Optional |
| ons-postshow | Expression | "postshow"イベントが発火された時の挙動を独自に指定できます。 Optional |
| ons-posthide | Expression | "posthide"イベントが発火された時の挙動を独自に指定できます。 Optional |
| ons-destroy | Expression | "destroy"イベントが発火された時の挙動を独自に指定できます。 Optional |
| シグネチャ | 概要 |
|---|---|
| show([options]) | ダイアログを開きます。 |
| hide([options]) | ダイアログを閉じます。 |
| isShown() | ダイアログが表示されているかどうかを返します。 |
| destroy() | ダイアログを破棄して、DOMツリーから取り除きます。 |
| getDeviceBackButtonHandler() | バックボタンハンドラを取得します。デフォルトの挙動を変更することができます。 |
| setCancelable(cancelable) | ダイアログを表示した際に、ユーザがそのダイアログをキャンセルできるかどうかを指定します。 |
| isCancelable() | このダイアログがキャンセル可能かどうかを返します。 |
| setDisabled(disabled) | このダイアログをdisabled状態にするかどうかを設定します。 |
| isDisabled() | このダイアログがdisabled状態かどうかを返します。 |
| on(eventName, listener) | イベントリスナーを追加します。 |
| once(eventName, listener) | 一度だけ呼び出されるイベントリスナを追加します。 |
| off(eventName, [listener]) | イベントリスナーを削除します。もしイベントリスナーが指定されなかった場合には、そのイベントに紐付いているイベントリスナーが全て削除されます。 |
| 名前 | 概要 |
|---|---|
| preshow | ダイアログが表示される直前に発火します。 |
| postshow | ダイアログが表示された直後に発火します。 |
| prehide | ダイアログが隠れる直前に発火します。 |
| posthide | ダイアログが隠れた後に発火します。 |
ダイアログを開きます。
| 名前 | 型 | 概要 |
|---|---|---|
| options | Object | オプションを指定するオブジェクト。 |
| options.animation | String | アニメーション名を指定します。"none", "fade", "slide"のいずれかを指定します。 |
| options.callback | Function | ダイアログが表示され終わった後に呼び出される関数オブジェクトを指定します。 |
ダイアログを閉じます。
| 名前 | 型 | 概要 |
|---|---|---|
| options | Object | オプションを指定するオブジェクト。 |
| options.animation | String | アニメーション名を指定します。"none", "fade", "slide"のいずれかを指定できます。 |
| options.callback | Function | ダイアログが隠れた後に呼び出される関数オブジェクトを指定します。 |
ダイアログが表示されているかどうかを返します。
返り値: ダイアログが表示されている場合にtrueを返します。
ダイアログを破棄して、DOMツリーから取り除きます。
バックボタンハンドラを取得します。デフォルトの挙動を変更することができます。
返り値: デバイスのバックボタンハンドラを返します。
ダイアログを表示した際に、ユーザがそのダイアログをキャンセルできるかどうかを指定します。
| 名前 | 型 | 概要 |
|---|---|---|
| cancelable | Boolean | ダイアログをキャンセル可能にする場合trueを指定します。 |
このダイアログがキャンセル可能かどうかを返します。
返り値: ダイアログがキャンセル可能な場合trueを返します。
このダイアログをdisabled状態にするかどうかを設定します。
| 名前 | 型 | 概要 |
|---|---|---|
| disabled | Boolean | trueを指定するとダイアログをdisabled状態になります。 |
このダイアログがdisabled状態かどうかを返します。
返り値: ダイアログがdisabled状態の場合trueを返します。
イベントリスナーを追加します。
| 名前 | 型 | 概要 |
|---|---|---|
| eventName | String | イベント名を指定します。 |
| listener | Function | イベントが発火した際に呼び出される関数オブジェクトを指定します。 |
一度だけ呼び出されるイベントリスナを追加します。
| 名前 | 型 | 概要 |
|---|---|---|
| eventName | String | イベント名を指定します。 |
| listener | Function | イベントが発火した際に呼び出される関数オブジェクトを指定します。 |
イベントリスナーを削除します。もしイベントリスナーが指定されなかった場合には、そのイベントに紐付いているイベントリスナーが全て削除されます。
| 名前 | 型 | 概要 |
|---|---|---|
| eventName | String | イベント名を指定します。 |
| listener | Function | イベントが発火した際に呼び出される関数オブジェクトを指定します。 |
ダイアログが表示される直前に発火します。
| 名前 | 型 | 概要 |
|---|---|---|
| event | Object | Event object. |
| event.dialog | Object | コンポーネントのオブジェクト。 |
| event.cancel | Function | この関数を実行すると、ダイアログの表示がキャンセルされます。 |
ダイアログが表示された直後に発火します。
| 名前 | 型 | 概要 |
|---|---|---|
| event | Object | Event object. |
| event.dialog | Object | コンポーネントのオブジェクト。 |
ダイアログが隠れる直前に発火します。
| 名前 | 型 | 概要 |
|---|---|---|
| event | Object | Event object. |
| event.dialog | Object | コンポーネントのオブジェクト。 |
| event.cancel | Function | この関数を実行すると、ダイアログの非表示がキャンセルされます。 |
ダイアログが隠れた後に発火します。
| 名前 | 型 | 概要 |
|---|---|---|
| event | Object | Event object. |
| event.dialog | Object | コンポーネントのオブジェクト。 |