jQuery EasyUI ウィンドウプラグイン -Messager メッセージボックス

jQuery EasyUI 插件jQuery EasyUI プラグイン

$.messager.defaults を介してデフォルトの defaults を上書きします。

メッセージボックス（messager）は、警告（alert）、確認（confirm）、プロンプト（prompt）、進捗（progress）など、さまざまなスタイルのメッセージボックスを提供します。すべてのメッセージボックスは非同期です。ユーザーはメッセージボックスと対話した後、コールバック関数を使用していくつかの操作を実行できます。

依存

  • window
  • linkbutton
  • progressbar

使い方

$.messager.alert('Warning','The warning message');
$.messager.confirm('Confirm','Are you sure you want to delete record?',function(r){
    if (r){
        alert('ok');
    }
});

プロパティ

名前 タイプ 説明 デフォルト値
ok string OKボタンのテキスト。 Ok
cancel string キャンセルボタンのテキスト。 Cancel

メソッド

名前 パラメータ 説明
$.messager.show options 画面の右下隅にメッセージウィンドウを表示します。options パラメータは構成オブジェクトです：
showType： メッセージウィンドウの表示方法を定義します。使用可能な値は null、slide、fade、show です。デフォルトは slide です。
showSpeed： メッセージウィンドウが表示を完了するまでの時間をミリ秒単位で定義します。デフォルトは 600 です。
width：メッセージウィンドウの幅を定義します。デフォルトは 250 です。
height：メッセージウィンドウの高さを定義します。デフォルトは 100 です。
title：ヘッダーパネルに表示されるタイトルテキスト。
msg：表示するメッセージテキスト。
style：メッセージウィンドウのカスタムスタイルを定義します。
timeout：0 と定義すると、ユーザーが閉じない限り、メッセージウィンドウは閉じません。0 以外の値と定義すると、メッセージウィンドウはタイムアウト後に自動的に閉じます。デフォルトは 4 秒です。

コード例：
$.messager.show({
    title:'My Title',
    msg:'Message will be closed after 5 seconds.',
    timeout:5000,
    showType:'slide'
});
// show message window on top center
$.messager.show({
    title:'My Title',
    msg:'Message will be closed after 4 seconds.',
    showType:'show',
    style:{
        right:'',
        top:document.body.scrollTop+document.documentElement.scrollTop,
        bottom:''
    }
});
$.messager.alert title, msg, icon, fn 警告プロンプトウィンドウを表示します。パラメータ：
title：ヘッダーパネルに表示されるタイトルテキスト。
msg：表示するメッセージテキスト。
icon：表示するアイコン画像。使用可能な値は error、question、info、warning です。
fn：ウィンドウが閉じられたときにトリガーされるコールバック関数。

コード例：
$.messager.alert('My Title','Here is a info message!','info');
$.messager.confirm title, msg, fn 「OK」と「キャンセル」ボタン付きの確認メッセージウィンドウを表示します。パラメータ：
title：ヘッダーパネルに表示されるタイトルテキスト。
msg：表示するメッセージテキスト。
fn(b)：コールバック関数。ユーザーが確認ボタンをクリックすると関数に true パラメータを渡し、それ以外の場合は false パラメータを渡します。

コード例：
$.messager.confirm('Confirm', 'Are you sure to exit this system?', function(r){
    if (r){
        // exit action;
    }
});
$.messager.prompt title, msg, fn 「OK」と「キャンセル」ボタン付きのメッセージウィンドウを表示し、ユーザーにテキストの入力を促します。パラメータ：
title：ヘッダーパネルに表示されるタイトルテキスト。
msg：表示するメッセージテキスト。
fn(val)：ユーザーが入力した値のパラメータを持つコールバック関数。

コード例：
$.messager.prompt('Prompt', 'Please enter your name:', function(r){
    if (r){
        alert('Your name is:' + r);
    }
});
$.messager.progress options or method 進捗のメッセージウィンドウを表示します。
options は次のように定義されます：
title：ヘッダーパネルに表示されるタイトルテキスト。デフォルト値は '' です。
msg：メッセージボックスの本文テキスト。デフォルト値は '' です。
text：プログレスバーに表示されるテキスト。デフォルト値は undefined です。
interval：各進捗の更新間の時間（ミリ秒単位）。デフォルト値は 300 です。

メソッドは次のように定義されます： bar：プログレスバー（progressbar）オブジェクトを取得します。
close：進捗ウィンドウを閉じます。

コード例：
進捗メッセージウィンドウを表示します。
$.messager.progress();
今、メッセージウィンドウを閉じます。
$.messager.progress('close');
jQuery EasyUI 插件jQuery EasyUI プラグイン その他の拡張機能