EasyUI 的各種提示框消息框配置

通過 $.messager.defaults 重寫預設的 defaults。

消息框（messager）提供不同樣式的消息框，包括警示（alert）、确認（confirm）、提示（prompt）、進展（progress）等等。所有的消息框都是異步的。使用者可以在與消息框互動後使用回調函數來完成一些動作。

一、首先是消息框

     $.messager.show  在螢幕的右下角顯示一個消息視窗，options 參數是一個配置對象：

<span style="font-family:SimSun;font-size:18px;">$.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:''
	}
});</span>
           

show主要有以下屬性：

<span style="font-family:SimSun;font-size:18px;">showType： 定義消息視窗如何顯示。可用的值是：null、slide、fade、show。預設是 slide。
showSpeed： 定義消息視窗完成顯示所需的以毫秒為機關的時間。預設是 600。
width：定義消息視窗的寬度。預設是 250。
height：定義消息視窗的高度。預設是 100。
title：頭部面闆上顯示的标題文本。
msg：要顯示的消息文本。
style：定義消息視窗的自定義樣式。
timeout：如果定義為 0，除非使用者關閉，消息視窗将不會關閉。如果定義為非 0 值，消息視窗将在逾時後自動關閉。預設是 4 秒。
</span>
           

二、顯示一個警告提示視窗 $.messager.alert()

$.messager.alert('My Title','Here is a info message!','info');
           

主要參數如下：

title：顯示在頭部面闆上的标題文本。
msg：要顯示的消息文本。
icon：要顯示的圖示圖檔。可用的值是：error、question、info、warning。
fn：當視窗關閉時觸發的回調函數。
           

三、顯示一個帶"确定"和"取消"按鈕的确認消息視窗 $.messager.confirm()

<span style="font-family:SimSun;">$.messager.confirm('Confirm', 'Are you sure to exit this system?', function(r){
	if (r){
		// exit action;
	}
});</span>
           

主要參數如下：

title：顯示在頭部面闆上的标題文本。
msg：要顯示的消息文本。
fn(b)：回調函數，當使用者點選确認按鈕時傳遞一個 true 參數給函數，否則給它傳遞一個 false 參數
           

四、顯示一個帶"确定"和"取消"按鈕的消息視窗，提示使用者輸入一些文本。$.messager.prompt

<span style="font-family:SimSun;font-size:18px;">$.messager.prompt('Prompt', 'Please enter your name:', function(r){
	if (r){
		alert('Your name is:' + r);
	}
});</span>
           

主要參數如下：

<span style="font-family:SimSun;font-size:18px;">title：顯示在頭部面闆上的标題文本。
msg：要顯示的消息文本。
fn(val)：帶有使用者輸入的數值參數的回調函數。</span>
           

五、顯示一個進度的消息視窗 $.messager.progress()

<span style="font-family:SimSun;font-size:18px;">//顯示進度條
$.messager.progress(); 
//關閉進度條顯示
$.messager.progress('close');</span>
           

參數

<span style="font-family:SimSun;font-size:18px;">options 定義如下：
title：顯示在頭部面闆上的标題文本，預設值是 '' 。
msg：消息框的主體文本，預設值是 '' 。
text：顯示在進度條裡的文本，預設值是 undefined 。
interval：每次進度更新之間以毫秒為機關的時間長度。預設值是 300。

方法定義如下： bar：擷取進度條（progressbar）對象。
close：關閉進度視窗。</span>