jquery easyui messager pluginの使用

3257 ワード

Messagerはalert、confirm、prompt、progressなど、マルチスタイルのメッセージボックスを提供しています.すべてのmessagerは非同期であり、ユーザはコールバック関数を使用してmessagerと対話することができる.
Messagerはwindow、linkbutton、progressbarに依存します.
Messager使用例
$.messager.alert('  ', '        ');

上記のコードは、警告ボックスをポップアップします.
$.messager.confirm('  ','          ?', function (r) if(r == true) {$(this).window('close');})

上記のコードは確認ボックスをポップアップします
Messagerのプロパティ
名前
値のタイプ
説明
デフォルト
ok
string
Okボタンのテキスト
Ok
cancel
string
Cancelボタンのテキスト
Cancel
Messagerの方法
名前
パラメータ
説明
$.messager.show
options
画面の右下にメッセージが表示されます.パラメータoptionsは、表示スタイルを構成するオブジェクトです.showType:この情報フォームがどのように表示されるかを定義します.オプションの値はnull、side、fade、showです.デフォルトはsideです.showSpeed:ウィンドウの表示が完了する時間を定義します.デフォルトは600ミリ秒です.width:ウィンドウの幅を定義し、デフォルトは250です.height:ウィンドウの高さを定義し、デフォルトは100です.title:panelの上部にあるタイトル.msg:表示する情報テキスト.style: Defines the custom dpecification style for message window. timeout: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
alertフォームが表示されます.パラメータは、title:panelのタイトルです.msg:表示する情報テキスト.icon:額アイコンを表示します.オプションの値はerror、question、info、warningです.fn:フォームが閉じたときのコールバック関数.ケースコード:
$.messager.alert('My Title','Here is a info message!','info');
$.messager.confirm
title, msg, fn
OkボタンとCancelボタンが付いた確認ボックスが表示されます.パラメータは、title:最上位パネルのタイトルです.msg:表示する情報テキスト.fn(b):コールバック関数、パラメータbのコールバックの値、trueはOkボタンをクリックしたこと、falseはCancelボタンをクリックしたことを示す.ケースコード:
$.messager.confirm('Confirm', 'Are you sure to exit this system?', function(r){
	if (r){
		// exit action;
	}
});
$.messager.prompt
title, msg, fn
OkボタンとCancelボタン付きの入力ボックスが表示され、ユーザーに入力を求めるプロンプトが表示されます.パラメータは以下の通りです.title:最上位パネルのタイトルです.msg:表示するテキスト情報.fn(val):コールバック関数、valコールバックユーザの入力.ケースコード:
$.messager.prompt('Prompt', 'Please enter your name:', function(r){
	if (r){
		alert('Your name is:' + r);
	}
});
$.messager.progress
options or method
進捗フォームThe options is defined as:title:The title text to be showed on header panel,default'.  msg: The message box body text, default ''.  text: The text to display in the progress bar, default undefined.  interval: The length of time in milliseconds between each progress update, default 300.  The method is defined as: bar: Get the progressbar object.  close: Close the progress window.  Code example: Show progress message window. 
	$.messager.progress(); 
Now close the message window. 
	$.messager.progress('close');