<!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>