ExtJS001HelloWorld弹窗
html页面
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 5 <title></title> 6 <meta charset="utf-8" /> 7 8 <-- Extjs样式及类库 --> 9 10 11 <link rel="stylesheet" type="text/css" href="Resource/Extjs/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all.css" /> 12 13 <script type="text/javascript" src="Resource/Extjs/bootstrap.js"></script> 14 15 <script type="text/javascript" src="Resource/Extjs/packages/ext-locale/build/ext-locale-zh_CN.js"></script> 16 17 <script type="text/javascript" src="Resource/Extjs/packages/ext-charts/build/ext-charts.js"></script> 18 19 20 21 <-- 引用外部js文件 --> 22 <script src="001_helloworld.js"></script> 23 24 25 26 </head> 27 <body> 28 29 </body> 30 </html>
<-- 001_helloworld.js 代码如下 -->
1 Ext.onReady(function () { //Ext.onReady 程序入库 2 /* 3 消息框 4 5 */ 6 7 Ext.MessageBox.alert('标题', 'Hello World!');//弹窗 8 9 10 11 /* 12 询问框 13 14 */ 15 //询问框 16 17 //Ext.Msg.confirm('提示', '确认删除', function (op) { 18 // if(op=='yes'){ 19 // alert('确认'); 20 // }else{ 21 // alert('取消'); 22 // } 23 24 //}); 25 26 27 28 29 30 /* 31 输入框 32 33 */ 34 35 //Ext.Msg.prompt('标题', '请输入姓名', function (op, val) { 36 // //console.info(op); //op确定 取消(ok cancel) val 输入的值 37 // //console.info(val); 38 // if (op == "ok") { 39 // console.info(op); 40 // console.info(val); 41 // } else { 42 // console.info(op); 43 // console.info(val); 44 // } 45 //}, this, true, '张三(输入框默认值)'); 46 47 48 49 /* 50 等待框 进度条 51 52 */ 53 //Ext.Msg.wait('提示', '我是内容', { 54 // interval: 400, //循环定时间隔! 55 // duration: 2000, //总时长 56 // increment: 5, //执行进度条的次数 5 次 执行一次进度(1-100) 一共执行5次 57 // text: '更新中',//进度条上的文字 58 // scope: this, //作用域 当前作用域 [skəʊp] 59 // fn: function () { 60 // //回调函数 61 // alert("更新成功"); 62 // }, 63 // animate:true //更新渲染时提供一个动画效果 就是进度条平滑的走。。 64 //}); 65 66 67 /* 68 show方法 69 自定义的提示框 70 */ 71 72 Ext.Msg.show({ 73 title: '我是自定义的提示框', 74 msg:'我是内容!!', 75 width: 300, 76 height: 300, 77 buttons: Ext.Msg.YESNOCANCEL, //显示的按钮呢 直接在Ext.window.MessageBoxView 看属性就能查到 78 icon:Ext.Msg.ERROR //图标 79 80 }); 81 82 });