`

ext--消息框

    博客分类：
  • Ext
ext 
阅读更多 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>messbox.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
    <link rel="stylesheet" type="text/css" href="/web/ext/resources/css/ext-all.css" />
    <!-- GC -->
 	<!-- LIBS -->
 	<script type="text/javascript" src="/web/ext/adapter/ext/ext-base.js"></script>
 	<script type="text/javascript" src="/web/ext/adapter/ext/ext-all.js"></script>
 	<!-- ENDLIBS -->

    <script type="text/javascript" src="/web/ext/ext-all-debug.js"></script>
    <script type="text/javascript">
    	alert1 = function(){
    		Ext.MessageBox.alert("你好","现在时间是："+new Date());
    	}
    	alert2 = function(){
    		Ext.MessageBox.alert("你好","现在时间是："+new Date(),function(){
    			Ext.MessageBox.alert("","带回调函数的，哈哈！");
    		});
    	}
    	prompt1 = function(){
    		Ext.MessageBox.prompt("输入内容","",function(btn,txt){
    			Ext.MessageBox.alert("","你输入的内容是："+txt);
    		});
    	}
    	
    	prompt2 = function(){
    		Ext.MessageBox.prompt("输入内容","",function(btn,txt){
    			Ext.MessageBox.alert("","你点击了"+btn+"<br>你输入的内容是："+txt);
    		},this,true);
    	}
    	
    	confirm1 = function(){
    		Ext.MessageBox.confirm("确认","请选择！",function(btn){
    			Ext.MessageBox.alert("","你选择了"+btn);
    		});
    	}
    	
    	customMsg = function(){
    		var config = {
    			title:"自定义对话框",
    			msg:"这个是自定义的对话框",
    			width:300,
    			multiline:true,
    			closable:false,
    			buttons:Ext.MessageBox.YESNOCANCEL,
    			icon:Ext.MessageBox.QUESTION,
    			fn:function(btn,txt){
    				Ext.MessageBox.alert("","你点击了"+btn+"<br>输入了："+txt);
    			}
    		};
    		Ext.MessageBox.show(config);
    	}
    	// 自定义进度条。
    	progressMsg = function(){
    		var config = {
    			title:"请稍候",
    			msg:"程序读取中...",
    			progressText:"正在初始化...",
    			width:300,
    			progress:true,
    			closable:false
    		};
    		
    		Ext.MessageBox.show(config);
    		var total = 0;
    		var f = function(v) {
    			return function(){
	    			if (v >= 100) {
	    				Ext.MessageBox.hide();
	    				Ext.MessageBox.alert("完成","程序加载完毕！");
	    				return;
	    			}
	    			else {
	    				Ext.MessageBox.updateProgress(v,(v/100)*100+"%已完成");
	    			}
    			};
    		};
    		
    		for (var i=0;i<=10;i++){
    			total = 10*i;
    			setTimeout(f(total),i*500);    			
    		}
    	}
    	
    	fly = function(){
    		var config = {
    			title:"飞出的消息框",
    			msg:"飞出去，飞回来...",
    			width:300,
    			closable:false,
    			multiline:true,
    			buttons:Ext.MessageBox.YESNO,
    			icon:Ext.MessageBox.OK,
    			animEl:"fly"
    		};
    		Ext.MessageBox.show(config);
    	};
    </script>
  </head>
  
  <body>
    <b>消息框组件</b><br>
    <p>
    	提示框用法<br>
    	<code>Ext.MessageBox.alert(String title,String msg,Function fn,Object scope);</code><br>
    	参数说明：<br>
    	title:标题。<br>
    	msg:提示内容。<br>
    	fn:关闭后调用的方法。<br>
    	scope:作用域。用于指定this指向哪里，一般不用管它。
    </p>
    
    <input type="button" value="button1" onclick="alert1();">
    <input type="button" value="button2" onclick="alert2();">
    <br>
    <b>输入框用法</b><br>
    <code>Ext.MessageBox.prompt(String title,String msg,Function fn,Object scope,Boolean/Number multiline)</code>
    参数说明：<br>
    前4个参数和alert一样，最后一个参数表示true(多行)或数字（默认高度）。<br>
     <input type="button" value="button3" onclick="prompt1();">
     <br>
     多行<br>
     <input type="button" value="button4" onclick="prompt2();">
     <br>
     <div>
     	<span>q确认框</span><br>
     	语法：<br>
     	<code>Ext.MessageBox.confirm(String title,String msg,Function fn,Object scope)</code>
     	<br>
     	参数桶alert。<br>
     	<input type="button" value="confirm" onclick="confirm1();">
     </div>
     
     <div>
     	<span>自定义消息框</span><br>
     	使用<code>show()</code>方法自定义。<br>
     	<code>show()</code>方法的语法：
     	<br>
     	<code>Ext.MessageBox.show(Object config)</code><br>
     	config常见属性：<br>
     	title:标题栏<br>
     	msg:消息内容<br>
     	width:消息框宽度<br>
     	multiline:是否显示多行文本<br>
     	closable:是否显示关闭按钮<br>
     	buttons:按钮<br>
     	icon:图标<br>
     	fn:回调函数<br>
     	<div>
     		<span>buttons取值：</span><br>
     		YES:确定<br>
     		CANCEL:	取消<br>
     		OKCANCEL:确定、取消<br>
     		YESNO:是、否<br>
     		YESNOCANCEL:是、否、取消<br>
     		<span>icons取值：</span><br>
     		INFO:信息图标<br>
     		WARNING:警告图标<br>
     		QUESTION:询问图标<br>
     		ERROR:错误图标<br>
     	</div>
     	<input type="button" value="custom" onclick="customMsg();">
     	
     </div>
     
     <div>
     	<span>进度条对话框</span><br>
     	进度条对话框是一个自定义的对话框，配置config时加上progress=true即可。<br>
     	同时还要设置其他信息，如进度提示等。<br>
     	<input type="button" value="进度条" onclick="progressMsg();">
     </div>
     
     <div>
     	<span>消息框飞出去</span>
     	<br>
     	config中加上animEl属性即可。<br>
     	<input type="button" value="飞起来" onclick="fly();" id="fly">
     </div>
  </body>
</html>



分享到：
| ext--下拉列表
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    Ext 仿QQ-MSN出现消息框

    NULL 博文链接：https://ytwy001.iteye.com/blog/1336977

    ext-opensource-netty

    MQTT服务器 (核心实现、可扩展消息存储、可集群、可处理消息) MQTT客户端 (核心实现、可扩展消息存储) WebSocket服务器 (核心实现、可处理消息) WebSocket客户端 (核心实现) 项目结构 ext-opensource-netty ├── ...

    封装一个Ext消息提示框，显示几秒后自动消失

    封装一个Ext消息提示框，显示几秒后自动消失

    Ext框架与Flex框架的整合实例

    环境：Window XP Sp3, IE 7.0, Tomcat 6.0, MyEclipse 5.5, Flex Builder 3, Ext 3.2。 使用步骤： 1、下载解压缩之后，使用IDE导入ExtAndFlex工程 2、使用IDE把该工程发布到Tomcat服务器 3、打开IE在地址输入...

    仿QQ-MSN弹出即时消息框

    ext模仿QQ-MSN右下角弹出即时消息框 下载直接使用

    Ext_MessageBox

    ext中的各种消息框,提示框,输入框，确认框，自定义消息框，进度条，以及滑动提示。

    php多进程框架-模拟java多线程接口simple-fork-php.zip

    ext-sysvmsg 消息队列 ext-sysvsem 同步互斥锁 ext-sysvshm 共享内存 特性 提供进程池 自动处理僵尸进程回收，支持无阻塞调用 提供共享...

    ExtJs消息提示框

    论坛上找的ExtJs消息提示框，各个方向的都有，十分人性化

    基于Springboot 版本 2.3.2.RELEASE版本开发的Example

    Springboot 2.3.2.RELEASE的 Example共计有9个，可...RabbitMQ的五种消息发送模式，RabbitMQ消息确认机制，RabbitMQ死信队列的定义，RabbitMQ消息100%可靠性方案实践，定时任务3种方式：@Scheduled，Quartz，XXL-JOB。

    简单实用的notie-js消息提示框插件.zip

    简单实用的notie.js消息提示框插件&lt;/title&gt; &lt;link rel="stylesheet" type="text/css" href="css/default.css?3.1.64"&gt; &lt;/head&gt; &lt;body&gt;[removed][removed] &lt;br&gt; &lt;br&gt; &lt;br&gt; ...

    Extjs4 消息框去掉关闭按钮(类似Ext.Msg.alert)

    但没有关闭按钮 由于Extjs4消息框中的关闭按钮，没有执行回调函数，点击关闭按钮后，直接关闭窗口。 实现代码如下： 代码如下: Ext.Msg.show({ title : ‘系统提示’, msg : ‘Extjs4 去掉提示框右上角关闭按钮’, ...

    Extjs4.2_加强examples.js 自动隐藏消息框

    Ext.example.msg('Done', 'Your fake data was saved!'); //自动消失 3s 后 Ext.example.msg('Done', 'Your fake data was saved!',true,3000); //说明 Ext.example.msg(标题，内容，是否自动消失，时间);

    php微信框架包含demo(powerd by arphp)

    自定义栏目， 发送消息 ， 微信接口 /** * 监听微信服务器推送信息Action. * * @return void */ public function indexAction() { // 注册微信服务器基本的几个事件 arComp('ext.weixin')-&gt;registerEvent...

    ext简单例子

    初学ext的例子，包含树，form，grid，日期框，消息框，combox，button

    ExtAspNet_v2.3.2_dll

    -修正Alert消息中引号未编码导致的JS错误(feedback:sun1299shine)。 +集成extjs3.0.3。 -修正弹出对话框的宽度计算错误(会保持最小的状态)。 -增加新的皮肤Gray。 -为示例工程添加改变语言和皮肤的下拉列表。...

    ExtAspNet v2.2.1 （2009-4-1） 值得一看

    -修正Alert消息中引号未编码导致的JS错误(feedback:sun1299shine)。 +集成extjs3.0.3。 -修正弹出对话框的宽度计算错误(会保持最小的状态)。 -增加新的皮肤Gray。 -为示例工程添加改变语言和皮肤的下拉列表。...

    pomelo-rpc-ext

    ＃pomelo-rpc-ws-pomelo的rpc框架＃＃安装 npm install pomelo-rpc-ws修改柚app.js var wsrpc = require('pomelo-rpc-ws');... 客户端部分生成RPC客户端代理，将消息路由到适当的远程服务器，并管理网络通信。 支持动态

    powerbuilder

    参数printjobnumber：用PrintOpen()函数打开的打印作业号x：integer类型，指定椭圆或圆外形框左上角的x坐标，以千分之一英寸为单位y：integer类型，指定椭圆或圆外形框左上角的y坐标，以千分之一英寸为单位width：...

    Ext.ux.window.DetailMessageBox:扩展于ExtJS5.1版本的MessageBox，可用折叠框显示详细信息的消息框

    Ext.ux.window.DetailMessageBox 带有可以折叠详细信息的对话框，该扩展组件是基于ExtJS5.1.1版本仿照MessageBox单例窗口编写。会有很多不完善的地方，将在以后的项目中或业余时间中进行修改。 部署扩展 将 ...

Magicbox
Global site tag (gtag.js) - Google Analytics