ExtJS 学习系列（2）---Message Box 详解 （2）
3.Message Box API 简介（2）
接着上面的API继续介绍。
lgetDialog() : Ext.Window
返回 Ext.Window 元素下的一个引用
参数:
无.
Returns:
Ext.Window
lhide() : Ext.MessageBox
把显示着的当前message box隐藏起来。
参数:
无.
Returns:
Ext.MessageBox
this
lisVisible() : Boolean
如果Message box 是显示着的，返回true
参数:
无.
Returns:
Boolean
显示 返回true 否则 false
lprogress( String title, String msg, [String progressText] ) : Ext.MessageBox
显示一个带进度条的Message box. 其中没有按钮，用户不能关闭。我们必须对通过Ext.MessageBox.updateProgress创建的更新负责，当结束的时候，予以关闭。
参数:
title : String
标题
msg : String
消息体
progressText : String
(可选的) progress bar 也就是进度条里面的内容(默认 '')
Returns:
Ext.MessageBox
this
Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--><scripttype="text/javascript">
Ext.onReady(function(){
Ext.MessageBox.progress('title','message');
});
</script>
效果如下。一个静止的进度条。
lprompt( String title, String msg, [Function fn], [Object scope], [Boolean/Number multiline], [String value] ) : Ext.MessageBox
显示一个窗口带OK和Cancle按钮，并暗示用户进入某一个文档区域，它可以是单行或者多行的textbox.在任何一个按钮按下之后，回调函数都会被执行,其方式同confirm。
参数:
title : String
标题
msg : String
信息内容
fn : Function
(可选的) 函数执行之后窗体关闭
scope : Object
(可选的) 回调函数范围
multiline : Boolean/Number
(可选的) True的话就是可以多行显示使用defaultTextHeight 属性。或者用高度（像素）创建。（默认的是单行输入）
value : String
(可选的) 默认的输入框内容 (defaults to '')
Returns:
Ext.MessageBox
this
Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--><scripttype="text/javascript">
functionf()
{
prompt('窗口','输入名字',f);
}
Ext.onReady(function(){
Ext.get("btn1").on("click",f);
});
</script>
按钮部分。
Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--><inputid="btn1"type="button"value="alert"/>
显示结果下图所示。
lsetIcon( String icon ) : Ext.MessageBox
在对话框中加一个特殊的图案. 默认情形下'ext-mb-icon' 提供样式可以使用,清空的字符串('')清空存在的ICON. 以下是构建好了的名字，也可以使用自己定义的:
Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->Ext.MessageBox.INFO
Ext.MessageBox.WARNING
Ext.MessageBox.QUESTION
Ext.MessageBox.ERROR
参数:
icon : String
一个指定的CSS类名字
Returns:
Ext.MessageBox
this
MessageBox
lshow( Object config ) : Ext.MessageBox
显示一个新的消息框，或者基于已经传递了的config选项重置一个旧的. All display functions (比如 prompt, alert, 等等)在Message Box内部调用的，虽然这些调用采取了一些捷径并且不支持所有的配置选项.
参数:
Øconfig : Object
如下:
üanimEl : String/Element
一个Message Box当它打开或者关闭的时候应该赋予的ID或者是元素(默认没有定义)
übuttons : Object/Boolean
一个按钮config对象(例如Ext.MessageBox.OKCANCEL or {ok:'Foo', cancel:'Bar'}),或者是false就不显示任何的按钮(默认是false)
üclosable : Boolean
False 就是窗口是不能关闭的。注意，进程和等待对话框将要忽视这个属性，病情一直隐藏关闭窗口就想他们只能程序性的关闭。（注意progress和wait对话框将要忽视这个属性并且通常隐藏起来，因为它是可以被程序关闭的.）
ücls : String
可以自定义的messagebox中的CSS样式。
defaultTextHeight : Number
以像素为单位单位的允许多行输入的文本框的高度(默认75)
üfn : Function
函数的具体说了
ubuttonId : String
按下的按钮的ID是，以下的一种之一
ok
yes
no
cancel
utext : String
输入区域的值如果{@link #show-option-prompt prompt} 或者 {@link #show-option-multiline multiline} 是true
üscope : Object
回调函数的范围
üicon : String
同上
üiconCls : String
同上
ümaxWidth : Number
对话框最大宽度（像素） (默认600)
üminWidth : Number
对话框最小宽度（像素）(默认100)
ümodal : Boolean
False 就是用户可以和MessageBox互动(默认true)
ümsg : String
一个字符串将要代替消息框里面消息体的内容(defaults to the XHTML-compliant non-breaking space character '')
ümultiline : Boolean
True 暗示用户可以多行输入 (默认false)
üprogress : Boolean
True显示一个进度条(默认false)
üprogressText : String
progress = true 显示进度条里面的内容(默认to '')
üprompt : Boolean
True为暗示用户输入单行的信息 (默认false)
üproxyDrag : Boolean
True为拖拽的时候显示一个轻量级别代理(默认false)
ütitle : String
标题内容
üvalue : String
The string value to set into the active textbox element if displayed
üwait : Boolean
True显示进度条(默认 false)
üwaitConfig : Object
一个 Ext.ProgressBar.waitConfig 对象 (只有当wait = true有效)
üwidth : Number
以像素为单位的对话框的宽度
²例子:
Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->Ext.Msg.show({
title:'Address',
msg:'Pleaseenteryouraddress:',
width:300,
buttons:Ext.MessageBox.OKCANCEL,
multiline:true,
fn:saveAddress,
animEl:'addAddressBtn',
icon:Ext.MessageBox.INFO
});
Returns:
Ext.MessageBox
this
Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--><scripttype="text/javascript">
Ext.onReady(function(){
Ext.get("btn1").on(
"click",
function(){
Ext.MessageBox.show({
title:"一个用时间控制的进度条",
msg:"10s后关闭进度框",
progress:true,
width:600,
wait:true,
waitConfig:{interval:1000},
closable:true
});
setTimeout(function(){Ext.MessageBox.hide()},10000);//10s之后调用hide（）函数关闭窗口
})
});
</script>
当progress为true 的时候，进度条是被显示的。每个1s进度条就会动一下。
lupdateProgress( Number value, String progressText, String msg ) : Ext.MessageBox
更新一个进程样式的消息框的内容和进度条.只有相关的消息框通过Ext.MessageBox.progress创建的或者调用了Ext.MessageBox.show方法的进程: true.
参数:
value : Number
0和1之间的任何数 (默认0)
progressText : String
进度条里面的显示内容 (默认'')
msg : String
消息框主体内容被指定的消息代替 (默认没有定义so that any existing body text will not get overwritten by default unless a new value is passed in)
Returns:
Ext.MessageBox
this
lupdateText( [String text] ) : Ext.MessageBox
更新消息框中的内容
参数:
text : String
(可选择) 把消息框中的元素用innerHTML 特殊字符串代替 (默认的 XHTML-compliant non-breaking 空'')
Returns:
Ext.MessageBox
this
lwait( String msg, [String title], [Object config] ) : Ext.MessageBox
显示一个可以带有自动更新的进度条消息框. 这个可以用来中断用户互动当有一个长时间等待进度条的完成 并没有定义好的间歇. 当更新进行完了之后应该关闭。.
参数:
msg : String
消息体内容
title : String
(可选的) 进度条标题
config : Object
(可选的) 一个Ext.ProgressBar.waitConfig对象
Returns:
Ext.MessageBox
This
Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--><scripttype="text/javascript">
Ext.onReady(function(){
Ext.MessageBox.wait('title',
'msg',
{interval:100,//速度很快
duration:5000,
increment:15,
text:'Updating
',scope:this,
fn:function(e){
alert(e);}
});
});
</script>
间歇时间0.1秒，5秒之后结束，每次增加数值15.显示内容是Updating...显示5秒结束之后。弹出对话框来。
附上：Ext.ProgressBar.waitConfig对象内容。看参数也能知道具体的是什么，持续时间，间隔，增长，内容，函数和范围。时间仓促，暂时不翻译。
Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->PropertyTypeDescription
--------------------------------------------------------------------------------------------
duration数值Thelengthoftimeinmillisecondsthattheprogressbarshould
runbeforeresettingitself(defaultstoundefined,inwhichcaseit
willrunindefinitelyuntilresetiscalled)
interval数值Thelengthoftimeinmillisecondsbetweeneachprogressupdate
(defaultsto1000ms)
increment数值Thenumberofprogressupdatesegmentstodisplaywithintheprogress
bar(defaultsto10).Ifthebarreachestheendandisstill
updating,itwillautomaticallywrapbacktothebeginning.
textStringOptionaltexttodisplayintheprogressbarelement(defaultsto'').
fnFunctionAcallbackfunctiontoexecuteaftertheprogressbarfinishesauto-
updating.Thefunctionwillbecalledwithnoarguments.Thisfunction
willbeignoredifdurationisnotspecifiedsinceinthatcasethe
progressbarcanonlybestoppedprogrammatically,soanyrequiredfunction
shouldbecalledbythesamecodeafteritresetstheprogressbar.
scope对象Thescopethatispassedtothecallbackfunction(onlyapplieswhen
durationandfnarebothpassed).
4.总结
关于MessageBox在API 上面的所有的控件，暂时就说这么多。本人新手，没有什么太大的水平。Demo写的也不是很好。觉得能写的都写上了。我觉的API上面的例子比较少。而且特别的凌乱。所以加上了一部分自己的写法和心得。希望或多或少能给大家带来一份新鲜。如果有什么不对的，请大家及时提出。我将不胜感激。
参考资料：
üExtJS API
ü谦虚天下
出处：
568
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
