Ext第一讲:信息提示框组件
2014-03-11 09:56
246 查看
1. Ext.MessageBox.alert()方法
APIalert ( String title, String msg, Function fn, Object scope ) : Ext.MessageBox
参数项:
title : String
The title bar text
msg : String
The message box body text
fn : Function
(optional) The callback function invoked after the message box is closed
scope : Object
(optional) The scope of the callback function
有四个参数,我们这里主要介绍前面三个。
title,标题,必选
msg,本体文本,必选
fn,在关闭弹出窗口后触发该函数,可选。
示例一:
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.alert("测试","弹出提示框");
}
);
添加事件处理
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.alert("测试","弹出对话框",function()
{
document.write("关闭对话框");
});
}
);
对按钮之进行判断
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.alert("测试","弹出对话框",function(e)
{
if(e =='ok') {
document.write("单击了确定按钮");
} elseif(e ==
'cancel') {
document.write("单击了关闭按钮");
}
});
}
);
2. Ext.MessageBox.confirm()方法
APIconfirm ( String title, String msg, Function fn, Object scope ) : Ext.MessageBox
参数项:
title : String
The title bar text
msg : String
The message box body text
fn : Function
(optional) The callback function invoked after the message box is closed
scope : Object
(optional) The scope of the callback function
参数和alert方法一样。
示例二:
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.confirm("保存","是否保存文件");
}
);
添加事件处理。
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.confirm("保存","是否保存文件",function(e){
document.write(e);
});
}
);
对按钮值进行判断。
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.confirm("保存","是否保存文件",function(e){
if(e =='yes') {
document.write("保存文件");
} elseif(e ==
'no') {
document.write("不保存文件");
}
});
}
);
3.Ext.MessageBox.prompt()方法
APIprompt ( String title, String msg, Function fn, Object scope, Boolean/Number multiline ) : Ext.MessageBox
title : String
The title bar text
msg : String
The message box body text
fn : Function
(optional) The callback function invoked after the message box is closed
scope : Object
(optional) The scope of the callback function
multiline : Boolean/Number
(optional) True to create a multiline textbox using the defaultTextHeight property, or the height in pixels to create the textbox (defaults to false / single-line)
multiline参数用来设置是否为多行。
示例三:
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.prompt("测试","请输入你的姓名");
}
);
多行文本
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.prompt("测试","请输入你的留言",null,null,true);
}
);
事件处理
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.prompt("测试","请输入你的留言",function(e,text)
{
if(e =="ok") {
document.write(text);
}
},null,true);
}
);
4. Ext.MessageBox.show()方法
APIshow ( Object config ) : Ext.MessageBox
animEl String/Element 对话框弹出和关闭时的动画效果
buttons Object/Boolean 弹出框按钮的设置
closable Boolean 如果为false,则不显示右上角的小叉叉,默认为true。
cls String 将客户自定的CSS应用到该对话框中
defaultTextHeight Number 多行文本框中文本高度
fn Function 关闭弹出框后执行的函数
icon String 弹出框内容前面的图标
maxWidth Number 最大大小(默认600)
minWidth Number 最小大小(默认100)
modal Boolean 是否为模式
msg String 消息的内容
multiline Boolean 设为true,则弹出框带有多行输入框
progress Boolean 设为true,显示进度条
progressText String 显示在进度条上的文本
prompt Boolean 设为true,则弹出框带有输入框
proxyDrag Boolean 设置为true,则为拖拽的时候显示一个轻量级别代理
title String 标题
value String 文本框中的值
wait Boolean 设为true,动态显示progress
waitConfig Object 配置参数,以控制显示progress
width Number 弹出框的宽度
示例四:
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.show({
title:"测试标题",
msg:"测试内容",
buttons:Ext.MessageBox.OKCANCEL,
icon:Ext.MessageBox.INFO,
prompt:true,
multiline:true,
width:400,
defaultTextHeight :150
});
}
);
进度条
Ext.onReady(
function TestMessageBox() {
Ext.MessageBox.show({
title:"进度条",
msg:"5秒后自动进入系统",
progress:true,
width:500,
wait:true,
waitConfig:{
interval:500,
duration:5000,
fn:function() {
Ext.MessageBox.hide();
}
}
});
}
);
相关文章推荐
- EXT_信息提示框组件_Ext.MessageBox
- 信息提示框组件 Ext.window.MessageBox
- Flash合照成员信息提示组件
- ExtJs是通过Ext.ToolTip和Ext.QuickTips两个组件来实现浮动提示功能的
- easyui ---- jEasyUI-定制提示信息面板组件
- 安装LR11 时,安装Microsoft Visual c++2005 sp1运行时组件,就会提示命令行选项语法错误,键入“命令/?”可获取帮肋信息
- 网狐荣耀版启动游戏时提示“相应的游戏服务组件信息不存在,房间创建失败”
- Ext.Net 1.x_Ext.Net_执行后台程序提示等待信息,运行完毕消失
- Ext.Net 1.x_Ext.Net_执行后台程序提示等待信息,运行完毕消失
- Ext.MessageBox信息提示框
- highcharts图表组件通过设置tooltip属性自定义数据提示信息
- 安装LoadRunner 11时弹窗提示"Micosoft Visual C++ 2005 SP1 可再发行组件包(X86):'命令行选项语法错误。键入命令 / ? 可获得帮助信息'"。
- 【原】基础篇:第十二篇,Ext组件系列之--如何获取后台返回的自定义错误信息和系统异常信息
- ExtJs是通过Ext.ToolTip和Ext.QuickTips两个组件来实现浮动提示功能的
- Flash MX 2004教程:使用信息提示组件 Alert
- Ext TextField默认提示信息,并支持中文按2个长度计算
- ExtJS之 信息提示框 Ext.window.MessageBox
- win764位loadrunner安装问题:提示:少了Microsoft Visual c++2005 sp1运行时组件,安装时会提示命令行选项语法错误,键入“命令/?”可获取帮肋信息,无法正常安装;
- highcharts图表组件通过设置tooltip属性自定义数据提示信息
- Eclipse+spket+Ext整合,解决提示信息