jQuery EasyUI 窗口插件 – Messager 消息框

2018-09-10 16:48 更新

jQuery EasyUI 窗口插件 - Messager 消息框

jQuery EasyUI 插件 jQuery EasyUI 插件

通過 $.messager.defaults 重寫默認(rèn)的 defaults。

消息框（messager）提供不同樣式的消息框，包括警示（alert）、確認(rèn)（confirm）、提示（prompt）、進(jìn)展（progress）等等。所有的消息框都是異步的。用戶可以在與消息框交互后使用回調(diào)函數(shù)來完成一些動(dòng)作。

依賴

  • 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');
    }
});

屬性

名稱 類型 描述 默認(rèn)值
ok string 確定按鈕的文本。 Ok
cancel string 取消按鈕的文本。 Cancel

方法

名稱 參數(shù) 描述
$.messager.show options 在屏幕的右下角顯示一個(gè)消息窗口，options 參數(shù)是一個(gè)配置對(duì)象：
showType： 定義消息窗口如何顯示?？捎玫闹凳牵簄ull、slide、fade、show。默認(rèn)是 slide。
showSpeed： 定義消息窗口完成顯示所需的以毫秒為單位的時(shí)間。默認(rèn)是 600。
width：定義消息窗口的寬度。默認(rèn)是 250。
height：定義消息窗口的高度。默認(rèn)是 100。
title：頭部面板上顯示的標(biāo)題文本。
msg：要顯示的消息文本。
style：定義消息窗口的自定義樣式。
timeout：如果定義為 0，除非用戶關(guān)閉，消息窗口將不會(huì)關(guān)閉。如果定義為非 0 值，消息窗口將在超時(shí)后自動(dòng)關(guān)閉。默認(rèn)是 4 秒。

代碼實(shí)例： 
$.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 顯示一個(gè)警告提示窗口。參數(shù)：
title：顯示在頭部面板上的標(biāo)題文本。
msg：要顯示的消息文本。
icon：要顯示的圖標(biāo)圖片?？捎玫闹凳牵篹rror、question、info、warning。
fn：當(dāng)窗口關(guān)閉時(shí)觸發(fā)的回調(diào)函數(shù)。

代碼實(shí)例： 
$.messager.alert('My Title','Here is a info message!','info');
$.messager.confirm title, msg, fn 顯示一個(gè)帶"確定"和"取消"按鈕的確認(rèn)消息窗口。參數(shù)：
title：顯示在頭部面板上的標(biāo)題文本。
msg：要顯示的消息文本。
fn(b)：回調(diào)函數(shù)，當(dāng)用戶點(diǎn)擊確認(rèn)按鈕時(shí)傳遞一個(gè) true 參數(shù)給函數(shù)，否則給它傳遞一個(gè) false 參數(shù)。

代碼實(shí)例： 
$.messager.confirm('Confirm', 'Are you sure to exit this system?', function(r){
	if (r){
		// exit action;
	}
});
$.messager.prompt title, msg, fn 顯示一個(gè)帶"確定"和"取消"按鈕的消息窗口，提示用戶輸入一些文本。參數(shù)：
title：顯示在頭部面板上的標(biāo)題文本。
msg：要顯示的消息文本。
fn(val)：帶有用戶輸入的數(shù)值參數(shù)的回調(diào)函數(shù)。

代碼實(shí)例： 
$.messager.prompt('Prompt', 'Please enter your name:', function(r){
	if (r){
		alert('Your name is:' + r);
	}
});
$.messager.progress options or method 顯示一個(gè)進(jìn)度的消息窗口。
options 定義如下：
title：顯示在頭部面板上的標(biāo)題文本，默認(rèn)值是 '' 。
msg：消息框的主體文本，默認(rèn)值是 '' 。
text：顯示在進(jìn)度條里的文本，默認(rèn)值是 undefined 。
interval：每次進(jìn)度更新之間以毫秒為單位的時(shí)間長度。默認(rèn)值是 300。

方法定義如下： bar：獲取進(jìn)度條（progressbar）對(duì)象。
close：關(guān)閉進(jìn)度窗口。

代碼實(shí)例：
顯示進(jìn)度消息窗口。 
$.messager.progress();
現(xiàn)在關(guān)閉消息窗口。 
$.messager.progress('close');
jQuery EasyUI 插件 jQuery EasyUI 插件
以上內(nèi)容是否對(duì)您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)