Ext Js 使用心得
1.使用Ext新增一个弹出窗口（组件）时，窗口（组件）的配置对象里的id属性如果和页面上的某个元素E的id相同时，组件会被渲染到元素E上，如果元素E的样式和弹出窗口（组件）的样式不一致时，会导致窗口不能被正常显示。如:
<html>
<head><title>Ext Js</title>
<link href="ext/resources/css/ext-all.css" type="text/css" rel="stylesheet"/>
<script language="javascript" src="ext/adapter/ext/ext-base.js"></script>
<script language="javascript" src="ext/ext-all.js"></script>
<script language="javascript">
function genWindow()
{
var _window = new Ext.Window({id:'treeWindow',border:0,layout:'fit',modal:true,width:200,height:350,html:'myWindow'});
//与页面上的div treeWindow冲突,弹出窗口不能被正常显示
_window.show();
}
Ext.onReady(function(genWindow();));
</script>
<body>
<div id="treeWindow" style="height:400px; width:500px; text-align:center;">content</div>
</body>
</html>
2.Ext弹出窗口(组件)的隐藏和销毁:如果窗口(组件)的内容不是动态获取的，并且有多次调用窗口（组件）的情况或可能时，则需要使用单例模式来创建弹出窗口(组件)对象，并且窗口(组件)的属性closeAction:'hide'（如果有使用窗口的'X'关闭功能）,用hide()方法隐藏弹出窗口(组件),而不能closeAction:'hide'或者用close（）方法将窗口（组件）销毁.因为用closeAction:'hide'或者用close（）方法会将窗口(组件)销毁的同时也将页面上的静态内容一并销毁，第二次调用就会出错(不正常)或者没有内容。
function openTeachPlanList()
{
/**************************************************************************
*如果不是动态内容，并且此方法可能调用多次时，配置窗口属性closeAction:'hide'，
*不然可能会出现第二次调用此方式时，静态内容已经被删除。
*每次调用此方法先检查窗口是否已经打开（隐藏）了,是则show(),否则创建
*这种情况属于单例模式的应用,需遵守单例的规则
***************************************************************************/
if(Ext.getCmp('_tplWindow'))
{
Ext.getCmp('_tplWindow').show();
return;
}
var tplWin = new Ext.Window({
id:'_tplWindow',
contentEl:'teachPlanList',//静态内容
title:'教案列表',
border:0,
layout:'fit',
buttonAlign:'center',
closeAction:'hide',//注意这里使用了hide
modal:true,
width:500,
height:250
});
tplWin.show();
}
分享到：
相关推荐
- **调试技巧**：分享了调试Ext JS应用的有效方法，包括使用浏览器的开发者工具来进行调试。 - **部署策略**：指导读者如何将Ext JS应用程序打包和部署到生产环境中。 #### 五、学习建议 - 对于初学者来说，建议先...
ExtJS是一个广泛使用的JavaScript库，特别适用于构建富客户端应用程序。在4.0版本中，它提供了许多强大的组件和工具，帮助开发者创建功能丰富的Web应用。本文将深入探讨Ext.util.Format.Number()函数，它是ExtJS 4.0...
### EXT开发过程中的心得 #### 一、EXTJS开发注意事项概览 在使用EXTJS进行Web应用程序开发的过程中，积累了一些经验和技巧，以下是一些重要的注意事项和建议： 1. **CSS和JS文件路径设置：** - 在加载CSS或JS...
【描述】虽然描述为空，但我们可以推断这篇博客可能详细介绍了作者在使用和开发Ext JS扩展过程中的心得体会，包括但不限于解决的问题、实现的功能以及可能遇到的陷阱。博主“laodaobazi”可能分享了一些实用技巧，...
在IT行业中，Ext JS是一个非常流行的JavaScript库，用于构建富客户端Web应用程序。它提供了一整套组件，包括GridPanel，这是一个强大的数据展示工具，能够处理大量数据并支持各种交互功能。"ext gridpanel 跨行"这个...
《API Ext2.2中文文档》是一份详细解读Ext JS 2.2版本API的资料，对于深入理解和应用这个JavaScript框架至关重要。Ext JS是一个用于构建富客户端Web应用程序的开源库，它提供了丰富的组件和功能，使得开发者能够创建...
1. **Ext JS框架**：Ext JS是一款强大的JavaScript库，用于构建桌面级的富互联网应用程序（RIA）。它提供了丰富的组件库，如表格、树形视图、图表等，以及布局管理器，使得开发者可以构建复杂的数据驱动的应用。 2....
Ext JS在发展过程中不仅一步步地巩固着自己在HTML、CSS、JavaScript领域无可比拟的优势，而且已经开始向相关领域发展扩张。例如，它从2.0.2版开始为Adobe的RIA技术AIR提供支持，并且为GWT开发了Ext GWT 2.0，这些都...
Ext JS是一个成熟的、基于JavaScript的前端框架，它提供了一套丰富的UI组件，用来创建丰富的交互式应用程序。Treegrid结合了树形视图和网格功能，允许用户以层次结构展示数据，并能够通过表格形式展示更详细的子节点...
Ext JS是一个用JavaScript编写的跨浏览器的用户界面库，用于构建复杂的前端应用程序。这个网站为开发者提供了大量的学习资源，包括文档、教程、示例代码等，适合各个级别的开发者学习和参考。 - **资源特点**： - ...
7. **EXT_JS实用开发指南**：`EXT_JS实用开发指南_个人整理笔记.docx`可能是作者的个人学习心得，其中包含了实践中遇到的问题和解决方案，对于初学者来说，这样的经验分享非常有价值。 8. **PDF和TXT文档**：`extjs...
最近我们在几个应用都使用到了 ExtJS ，对公司以前开发的一个 OA 系统也正在使用 ExtJS 2.0 进行改造，使得整个系统在用户体验上有了非常大的变化。本教程记录了学 习 ExtJS 的一些心得及小结，希望能帮助正在学习或...
因此，对于ExtJS组件，建议优先使用`Ext.getCmp()`来操作。 ### 学习心得与笔记要点 1. **组件ID的重要性**：在创建ExtJS组件时，务必为其分配一个唯一的ID，这将极大地方便后续通过`Ext.getCmp()`进行组件的查找...
ExtJS是一个用javascript编写，与后台技术无关的前端ajax框架。因此，可以把ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。 最近我们在几个应用都使用到了ExtJS，对公司以前开发的一个OA系统也正在使用ExtJS...
博客中的“extjs笔记（1）”可能是作者分享的学习心得，对于理解这三个js如何协同工作会有很大帮助。 在实际开发中，理解和熟练运用这些核心文件，将有助于构建高效、可维护的ExtJS应用。同时，持续学习和实践是...
`Ext-core.pdf` 是关于Ext Core的文档，Ext Core是ExtJS的基础框架，它提供了一组核心的JavaScript工具和类库，包括DOM操作、事件处理、动画效果等。理解Ext Core是深入学习ExtJS的关键，因为它是整个库的基础，包含...
ExtJS是一个用javascript编写，与后台技术无关的前端ajax框架。因此，可以把ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。 最近我们在几个应用都使用到了ExtJS，对公司以前开发的一个OA系统也正在使用ExtJS...
本文将基于一份初学者的学习心得，详细介绍ExtJS的基础知识，并通过具体的示例来帮助理解如何使用ExtJS创建窗口(Window)和标签页(Tab Panel)。 #### 二、基础知识介绍 1. **Ext.onReady()** - 这个函数确保当DOM...