MessageBox:弹出窗口

1 Ext.onReady(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方法,其方法声明为:

alert( String title, String msg, [Function fn], [Object scope] ) : Ext.window.MessageBox

Parameters

  • title : String

    标题条文本

  • msg : String

    消息盒本体文本

  • fn : Function (optional)

    消息盒子关闭(点击关闭或者确认按钮)后调用的回调函数

  • scope : Object (optional)

    回调函数被执行的范围(this reference)。

    Defaults to: window

Returns

  • Ext.window.MessageBox

    this

Ext.MessageBox对象,是Ext.Window.MessageBox接口的单例实现

1 Ext.onReady(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         Ext.onReady(function () {
 2             Ext.Msg.confirm("标题","Yes Or No",function (op) {
 3                 if (op == "yes"){
 4                     alert("确认了");
 5                     //点击确认后要执行的操作
 6                 }else{
 7                     alert("取消了");
 8                     //点击取消后要执行的操作
 9                 }
10             },this);
11         })

  回调函数有一个参数,传递的是用户点击的按钮,如果点击了确认,就传递yes,如果点击了取消,就传递no

prompt方法:有输入框的确认/取消 弹出框

 1         Ext.onReady(function () {
 2             Ext.Msg.prompt("标题","请输入姓名:",function (id,val) {
 3                 //id=ok id=cancel
 4                 if ("ok" == id){
 5                     //点击了确认要做的事情
 6                     alert("1:"+val);
 7                 }else{
 8                     //点击了取消要做的事情
 9                     alert("2:"+val);
10                 }
11             },this,true,"张三");
12         })

  回调函数有两个参数,第一个表示用户点击的按钮(ok或cancel),第二个参数表示文本框中的输入值

  prompt参数说明:标题,提示信息,回调函数,作用域,是否多行文本框,文本框默认值

wait方法:进度条

 1         Ext.onReady(function () {
 2             Ext.Msg.wait("提示信息","内容",{
 3                 interval: 500, //循环定时间隔,毫秒
 4                 duration: 5000,//总时长,毫秒
 5                 increment: 3,//执行进度条的次数
 6                 text: ‘Updating...‘,//进度条上的提示文字
 7                 scope: this,
 8                 fn: function(){
 9                     alert("执行完毕");
10                 }
11             })
12         })

show方法:自定义弹出框

 1         Ext.onReady(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         })

主要还是看文档

时间: 2024-11-07 15:52:48

MessageBox:弹出窗口的相关文章

软件测试---弹出窗口

视频地址(第五课时):https://pan.baidu.com/s/1gfLVC2n  alert 弹出窗口 Alert Should Be Present Get Alert Message  confirm 弹出窗口 Choose Cancel On Next Confirmation Choose Ok On Next Confirmation Confirm Action AutoIt Libary

JS中,根据div数值判断弹出窗口

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> div{ width: 50px; height: 50px; margin: 20px; float: left; border: 1px solid orange; } </style>

jsp网页弹出窗口的多种办法

http://blog.csdn.net/huangfoxjava/article/details/2973033 登录|注册     huangfoxjava的专栏 目录视图 摘要视图 订阅 关于jsp网页弹出窗口[很多种方法......] 分类: JSP2008-09-24 14:22 5799人阅读 评论(0) 收藏 举报 jspjavascript框架html脚本浏览器 各种弹出页面的设计 [1.普通的弹出窗口] 其实代码非常简单: <SCRIPT LANGUAGE=javascript

android弹出窗口的实现(PopupWindow)

最近看到新浪微博顶部栏的微博分组效果很炫,从网上查了一些资料明白原来是用PopupWindow实现的,今天自己也写了一个例子实现了这种效果,希望对大家有帮助. PopupWindow就是弹出窗口的意思,类似windows下面的开始按钮.PopupWindow可以实现浮层效果,而且可以自定义显示位置,出现和退出时的动画. 首先定义新浪微博的顶部栏,title_two_button.xml和main.xml [html] view plaincopyprint? <?xml version="

fancybox关闭弹出窗口parent.$.fancybox.close();

fancybox弹出窗口右上角会自带一个关闭窗口,并且点击遮罩层也会关闭fancybox 有时我们不需要这样进行关闭,隐藏关闭窗口,并且遮罩层不可点击 在弹出窗口页面加一链接进行关闭使用parent.$.fancybox.close();可进行对其关闭 以下为弹出页面的代码: function myclose(){ parent.$.fancybox.close(); } <a href="javascript:myclose();">关闭</a> 需要注意的一

asp .NET弹出窗口 汇总(精华,麒麟创想)

asp .NET弹出窗口 汇总(精华,麒麟创想) 注://关闭,父窗口弹出对话框,子窗口直接关闭 this.Response.Write("<script language=javascript>window.close();</script>"); //关闭,父窗口和子窗口都不弹出对话框,直接关闭 this.Response.Write("<script>");this.Response.Write("{top.ope

弹出窗口

1.新建模式对话框(浏览器窗口在最顶层): 1 function DotVideo2() { 2 var id = '@ViewBag.TopicsID'; 3 //模式对话框 4 window.showModelessDialog('/ConferenceFront/DocVideoPlay?TopicID=' + id + '', 'newwindow', 'dialogheight:480px;dialogwidth:300px;dialogtop:10px;dialogleft:880p

JS弹出窗口代码大全(详细整理)

1.弹启一个全屏窗口 复制代码代码如下: <html> <body http://www.jb51.net','脚本之家','fullscreen');">; <b>www.jb51.net</b> </body> </html> 2.弹启一个被F11化后的窗口 复制代码代码如下: <html> <body 'http://www.jb51.net','脚本之家','channelmode');"

selenium webdriver学习(六)------------如何得到弹出窗口

在selenium 1.X里面得到弹出窗口是一件比较麻烦的事,特别是新开窗口没有id.name的时候.当时还整理了处理了几种方法,详见:http://seleniumcn.cn/read.php?tid=791 .在selenium webdriver中得到新开窗口相对简单的多,它无关新开窗口的id.name等属性.以下面的html为例: [html] view plaincopyprint? <span style="white-space: normal; background-col

EPUB弹出窗口式脚注

参考原文:EPUB弹出窗口式脚注 网上搜到一些国学典籍的EPUB版,虽有古人的注解,但正文和注解混排在一起,当我只想迅速读正文的时候比较碍眼.于是研究了一下 EPUB3 中有关脚注(footnote)的规格定义,写了一个 Python 脚本把所有混在正文中的脚注全部改写成了弹出窗口样式,在 iBooks 里测试通过,略记一笔. 什么是EPUB弹出窗口式脚注 弹出式脚注是 EPUB3 推出的,简单的说就是正文中加一个链接锚点,对应一个脚注模块,点击链接的时候,脚注内容会直接以弹出窗口的形式显示出来