MessageBox:弹出窗⼝
Ready(function () {
2 Ext.MessageBox.alert("提⽰信息!","Hello World!");
3 });
Ext,是⼀个对象,onReady是Ext的准备函数。
Ext相关的代码都会在onReady函数中编写,类似于window的onload⽅法,以及jQuery中的onReady⽅法。
其执⾏时机是在页⾯DOM对象加载完毕后⽴即执⾏(这点和jQuery是⼀样的,window的onload⽅法,是在整个页⾯元素都加载完后才执⾏)。
MessageBox:这是ExtJs提供的弹出提⽰框组件
Ext.MessageBox,可以简写成Ext.Msg,Msg对象有⼀个alert⽅法,其⽅法声明为:
( title, msg, [ fn], [ scope] ) :
Parameters
title :
标题条⽂本
msg :
消息盒本体⽂本
fn : (optional)
消息盒⼦关闭(点击关闭或者确认按钮)后调⽤的回调函数
scope : (optional)
回调函数被执⾏的范围(this reference)。
Defaults to: window
Returns
this
Ext.MessageBox对象,是Ext.Window.MessageBox接⼝的单例实现
Ready(function () {
2 Ext.Msg.alert("提⽰信息!","Hello World!",function () {
3 console.info("我是回调函数")
4 },this);
5 });
MessageBox对象的alert⽅法,不同于JavaScript中的alert,MessageBox的alert,其实只是⼀个div,只不过加了⼀些样式,使其看起来像个弹窗。
怎么验证呢?
只要前后分别调⽤alert和MessageBox.alert,真正的弹窗,是会发⽣堵塞的。
其他Ext.Msg对象的常⽤⽅法
confirm⽅法:确认/取消弹出框
1 Ready(function () {
2 firm("标题","Yes Or No",function (op) {
弹出窗口代码编写3if (op == "yes"){
4 alert("确认了");
5//点击确认后要执⾏的操作
6 }else{
7 alert("取消了");
8//点击取消后要执⾏的操作
9 }
10 },this);
11 })
回调函数有⼀个参数,传递的是⽤户点击的按钮,如果点击了确认,就传递yes,如果点击了取消,就传递no prompt⽅法:有输⼊框的确认/取消弹出框
1 Ready(function () {
2 Ext.Msg.prompt("标题","请输⼊姓名:",function (id,val) {
3//id=ok id=cancel
4if ("ok" == id){
5//点击了确认要做的事情
6 alert("1:"+val);
7 }else{
8//点击了取消要做的事情
9 alert("2:"+val);
10 }
11 },this,true,"张三");
12 })
回调函数有两个参数,第⼀个表⽰⽤户点击的按钮(ok或cancel),第⼆个参数表⽰⽂本框中的输⼊值
prompt参数说明:标题,提⽰信息,回调函数,作⽤域,是否多⾏⽂本框,⽂本框默认值
wait⽅法:进度条
1 Ready(function () {
2 Ext.Msg.wait("提⽰信息","内容",{
3 interval: 500, //循环定时间隔,毫秒
4 duration: 5000,//总时长,毫秒
5 increment: 3,//执⾏进度条的次数
6 text: '',//进度条上的提⽰⽂字
7 scope: this,
8 fn: function(){
9 alert("执⾏完毕");
10 }
11 })
12 })
show⽅法:⾃定义弹出框
1 Ready(function () {
2 Ext.Msg.show({
3 title: 'Address',
4 msg: 'Please enter your address:',
5 width: 300,
6 height:300,
7 buttons: Ext.Msg.OKCANCEL,
8 icon: Ext.window.MessageBox.INFO
9 });
10 })
主要还是看⽂档
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论