Ext简单demo示例

时间：2023-01-18 13:33:48
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

 <html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

     <title>Ext简单demo示例</title>

     <link rel="stylesheet" type="text/css" href="ExtJS/resources/css/ext-all.css">

     <script type="text/javascript"  src="ExtJS/adapter/ext/ext-base.js" ></script>

     <script type="text/javascript"  src="ExtJS/ext-all.js" ></script>

     <script>

     Ext.onReady(function(){

     var tabs = new Ext.TabPanel({

     //applyTo: 'tabs', //这里将把我们自己创建的id 为tabs 的div 渲染成tabs

     activeTab: 0,

     deferredRender: false,

     autoTabs: true,

     items: [{

         title: 'Tab 1',

         html: 'A simple tab',

         closable: true,

          listeners: {

                 'beforeclose':conrirmTab

             }

     },{

         title: 'Tab 2',

         html: 'Another one',

         closable: true,

         listeners: {

                 'beforeclose':conrirmTab

             }

     }]

     });

     var win = new Ext.Window({

     title:'Ext简单demo示例',

     el:'content',//将此div 创建成窗体对象

     layout:'fit',//布局

     width:500,

     height:300,

     closeAction:'hide',//设置是否可以关闭

     plain: true,

     draggable:false,

     maximizable:true,

     minimizable:true,

     modal:false,

     onEsc:function aa(){

         Ext.Msg.alert('aaa');

     },

     resizable:false,

     collapsible:true,

     plain:true,

     items:tabs

     });

     function conrirmTab(e){

         Ext.Msg.confirm('操作确认','操作确认',

             function(btn,text){

                 if(btn=='yes'){

                 tabs.remove(e);

             }

             });

         return false;

     }

     win.show(Ext.getBody());//在body 中渲染此窗体

     });

     </script>

 </head>

 <body>

 <div id="content">

 </div>

 </body>

 </html>

Ext简单demo示例的更多相关文章

  1. Django实战&lpar;一&rpar;之简单Demo

    菜鸟教程上Django安装可供参考: 参考链接: http://www.runoob.com/django/django-install.html 菜鸟教程上如果不行的话,下面博客网址可以供参考 Li ...

  2. 【分享】Vue 资源典藏（UI组件、开发框架、服务端、辅助工具、应用实例、Demo示例）

    Vue 资源典藏,包括:UI组件 开发框架 服务端 辅助工具 应用实例 Demo示例 element ★11612 - 饿了么出品的Vue2的web UI工具套件 Vux ★7503 - 基于Vue和 ...

  3. html5本地存储之localstorage 、本地数据库、sessionStorage简单使用示例

    这篇文章主要介绍了html5本地存储的localstorage .本地数据库.sessionStorage简单使用示例,需要的朋友可以参考下 html5的一个非常cool的功能,就是web stora ...

  4. SpringBoot整合Swagger2&lpar;Demo示例&rpar;

    写在前面 由于公司项目采用前后端分离,维护接口文档基本上是必不可少的工作.一个理想的状态是设计好后,接口文档发给前端和后端,大伙按照既定的规则各自开发,开发好了对接上了就可以上线了.当然这是一种非常理 ...

  5. Vue UI组件 开发框架 服务端 辅助工具 应用实例 Demo示例

    Vue UI组件 开发框架 服务端 辅助工具 应用实例 Demo示例 element ★11612 - 饿了么出品的Vue2的web UI工具套件 Vux ★7503 - 基于Vue和WeUI的组件库 ...

  6. SSH简单Demo

    web.xml <?xml version="1.0" encoding="UTF-8"?> <web-app version="3 ...

  7. 设计模式之单例模式的简单demo

    /* * 设计模式之单例模式的简单demo */ class Single { /* * 创建一个本类对象. * 和get/set方法思想一样,类不能直接调用对象 * 所以用private限制权限 * ...

  8. Spring的简单demo

    ---------------------------------------- 开发一个Spring的简单Demo,具体的步骤如下: 1.构造一个maven项目 2.在maven项目的pom.xml ...

  9. 使用Spring缓存的简单Demo

    使用Spring缓存的简单Demo 1. 首先创建Maven工程,在Pom中配置 <dependency> <groupId>org.springframework</g ...

随机推荐

  1. Codeforces 731C Socks 并查集

    题目:http://codeforces.com/contest/731/problem/C 思路:并查集处理出哪几堆袜子是同一颜色的,对于每堆袜子求出出现最多颜色的次数,用这堆袜子的数目减去该值即为 ...

  2. Bootstrap 3 模态框播放视频

    Bootstrap 3 模态框播放视频 I'm trying to use the Modal feature from Bootstrap 3 to show my Youtube video. I ...

  3. hdu 1811Rank of Tetris &lpar;并查集 &plus; 拓扑排序&rpar;

    /* 题意:这些信息可能有三种情况,分别是"A > B","A = B","A < B",分别表示A的Rating高于B,等于B ...

  4. Instruction （hdu 5083）

    Instruction Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Tota ...

  5. asp&period;net实现将网页内容输出到word并下载到本地

    个人觉得要实现这个功能如果没有类库提供的几个关键函数,还是比较繁琐的.所以首先介绍几个将要在代码中使用的关键函数和参数,然后再说函数实现.注意问题等. 关键函数: 1.函数原型:Response.Ap ...

  6. PCB流程-外型加工

  7. 经验19--C&num;大事

    以前学过C#大事.但我还没有搞懂怎么弄. 这一次,他们下进行了研究. 1.定义参数类,对于参数的传递活动.(可以省略) public class UserEventArgs     {         ...

  8. 剑指offer例题分享--6

    前言:继续整理例题,快速做完这部分,然后继续用C++去刷数据结构和算法的题. 面试题28: 代码如下: #include<iostream> #include<stdio.h> ...

  9. Hyperledger Fabric密码模块系列之BCCSP（五） - 国密算法实现

    Talk is cheap, show me your code. 代码也看了,蛋也扯了,之后总该做点什么.响应国家政策,把我们的国密算法融合进去吧--  先附两张bccsp下国密算法的设计实现图. ...

  10. recovery 恢复出厂设置失败Data wipe failed

    最近客户反馈,编译32位的android系统,在recovery中执行恢复出厂设置的时候失败了,失败的打印提升信息如下. Formatting /data... [ 2.191404] E:get_f ...

相关文章