写一个Ext控件的理论 - PeterLee - ITeye博客

`

peter2009

浏览: 552624 次
性别:
来自: 北京

最近访客更多访客>>

yjxandsp

juzhibest

u012363178

zh_harry

博主相关

博客

微博

相册

收藏

留言

关于我

文章分类

社区版块

存档分类

最新评论

beck_iceblock： [/color][color=white][color=oli ...
MYSQL的group_concat()函数中实现将多行同一字段数据合并成一个数据
瞎折腾球： fristname 和 list name ，email填什么 ...
JetBrain WebStorm 注册码
瞎折腾球： Your license key cannot be foun ...
JetBrain WebStorm 注册码
学习学习学习11111：第一个可用，感谢，赞一个
JetBrain WebStorm 注册码
ichenwenjin：不错,能用
JetBrain WebStorm 注册码

写一个Ext控件的理论

博客分类：

Ext

阅读更多

经大漠穷秋的点拨

编写一个Ext的控件要注意一下

initList分两大步操作，
首先渲染一个打底的“层”用来作为TreePanel的容器，紧接着就把TreePanel渲染到这个层中去。。

在initList中还需要注意对list和tree的监听，它们分别是onViewOver和onTreeClick两个工具函数。提供onTreeClick这个方法的原因很简单，当树节点被点击的时候，就把选中节点的值设置到文本框中去
。而提供onViewOver的原因稍微复杂一些：由于list是直接渲染到<body>标签的，因此，如果list已经
展开，而容纳ComboTree的容器发生了移动，list就不会跟随容器而移动，于是就会产生比较诡异的
现象。因此，当list失去焦点的时候，最好把它折叠起来。

同时，由于在树节点上点击的时候，作为容器的list会首先失去焦点，从而触发beforeBlur方法被执行
，于是下拉树就会被折叠起来，此时就无法获得哪个节点被点击了。读者可以把beforeBlur内部的函
数调用注释掉，然后查看页面执行的效果：

beforeBlur:function(){
this.assertValue();
}
正是由于组件的beforeBlur是在onTreeClick方法之前被执行的，因此，当下拉树展开时，我们需要一
个onViewOver工具函数，当鼠标在树中的节点上移动时，实时记录鼠标位于哪个节点上，这样就可
以在beforeBlur方法中做一点额外的工作了。以上就是为什么需要onViewOver、beforeBlur、
assertValue、postBlur四个工具方法的原因。
纯文字描述比较抽象，读者可对照界面，自行修改相应的代码，然后查看效果。

分享到：

ExtJs 与 Structs2交互的几大总结 | 关于Ext从Tree向Tree拖拽的问题

2011-08-05 08:29
浏览 1044
评论(0)
分类:Web前端
查看更多

评论

发表评论

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

相关推荐

EXT 组件和控件的视频教程: EXT Grid是EXT JS中的一个关键组件，主要用于展示和操作表格数据。这个“EXT 组件和控件的视频教程”很可能详细讲解了如何有效地使用EXT Grid以及相关组件。在EXT Grid的使用中，数据通常是从服务器端获取并以...

ext日期时间控件（支持Extjs 3.0以上版本.）: 且在IE6、Firefox3.5.2、Chrome5.0都测试通过（理论上支持更多浏览器，由于本人只装了这些，所以只测了这些）。凑满100分后开源。 ☆☆☆☆☆注意：目前已开源，开源代码下载地址☆☆☆☆☆☆☆ ...

Ext.Net源码: Ext.Net源码是一个开源项目，专注于为.NET开发者提供与ExtJS库对应的服务器端控件集。这个项目的主要目的是简化在ASP.NET环境中使用JavaScript库ExtJS的过程，通过提供强大的服务器端支持，使得开发者能够利用C#或VB...

Ext.NET Web Application Development: - **ASP.NET MVC**：一个现代的轻量级框架，更适合构建可扩展性强、易于维护的Web应用。这些技术的结合使得开发者能够根据项目需求选择最适合的开发方式，无论是在传统环境中还是在更加现代化的应用场景下都能...

Practical Ext JS 4: 2. **Ext JS 4概览**：这部分内容介绍了Ext JS框架的基本概念和主要特点，Ext JS是一个成熟的JavaScript库，专为创建跨浏览器的交互式网页应用程序而设计。这里将对Ext JS 4的新特性有所涉及，并通过一些关键的UI...

JavaScript凌厉开发Ext详解与实践(源码): 第12章“简单的新闻管理系统”提供了一个实际的应用场景，将前面所学知识综合运用到新闻管理系统的开发中，帮助读者巩固理论知识，提升实战能力。综上所述，这本书全面覆盖了从基础到高级的ExtJS开发技术，结合...

Learning_Ext_JS.pdf使用中文文档: ”这表明该书的目的在于为读者提供一个详尽的学习指南，以帮助他们更好地理解和掌握Ext JS框架。此文档对于那些想要深入学习并应用Ext JS的开发者来说非常有价值。 #### 三、作者介绍及贡献文档的部分内容提到了...

Practical.Ext.JS.4.pdf: 第二章“Overview of ExtJS4”为读者提供了一个Ext JS 4的概览，讨论了其特性，比如组件化结构、丰富的UI控件和兼容性等。这部分内容为读者理解Ext JS 4框架的整体架构和设计理念提供了基础。第三章...

ajax_ext开发材料整合: 7. `js时间控件.rar`：这个RAR文件可能包含了一个JavaScript实现的时间选择器控件，通常用于增强用户界面。 8. `js实现图片新闻.rar`：这可能是一个使用JavaScript实现的图片新闻轮播组件，展示了JavaScript在动态...

EXT 中文手册用实例来说话: 总的来说，这份手册是一个全面了解和学习EXTJS的好资源，无论你是前端开发的新手还是希望提升EXTJS技能的开发者，都能从中受益匪浅。通过阅读并实践手册中的实例，你将能够熟练运用EXTJS构建高效、美观且功能强大的...

Ext JS 3.2 学习指南: 本书采用章节式结构，每一章都聚焦于Ext JS的一个关键方面。这样的安排有助于读者逐步深入地理解框架的功能，并能够在实际项目中迅速应用所学知识。 ##### 4.1 第一部分：基础入门 - **第1章：Ext JS 快速入门**：...

Ext.NET+Web+Application+Development.pdf: Ext.NET是一个用于创建丰富互联网应用程序的开源JavaScript库，它是Ext JS的一个.NET版本。Ext.NET提供了大量的UI组件和工具，使得开发人员能够轻松地创建功能强大且用户友好的Web界面。它支持多种.NET平台，包括ASP...

Ext开发视频教程---ppt: 2. Ajax框架有Prototype.js、YUI、JQuery、Dojo、Echo2和Ext等，其中Ext是一个强大的Ajax框架，源自Yahoo! UI。 **三、Ext简介** 1. Ext是一个基于客户端的Ajax框架，用于构建富交互的Web应用程序界面，其特点是...

《Ext江湖》代码分析EA工程(请用EA打开): 总的来说，《Ext江湖》代码分析EA工程是一个宝贵的教育资源，它结合了理论与实践，通过专业工具帮助开发者深入理解Ext JS，并提供了丰富的学习资源和社区支持。无论你是初学者还是经验丰富的开发者，都可以从中受益...

两本Ext jx中文电子书: Ext Js是一种基于JavaScript的前端开发框架，主要用于构建富互联网应用程序（RIA）。它提供了一套完整的组件模型、数据绑定机制和丰富的用户界面控件，使得开发者能够创建出具有桌面级用户体验的Web应用。这两本中文...

深入浅出Ext.JS.徐会生例子: Ext.JS是一个强大的JavaScript库，专门用于构建富客户端Web应用程序。它提供了丰富的用户界面组件、数据绑定机制和可扩展的架构，使得开发人员能够创建功能复杂的桌面级网页应用。"深入浅出Ext.JS.徐会生例子"可能是...

Ext GWT 2.0: Beginner's Guide: Ext GWT（GWT eXtension）是Google Web Toolkit（GWT）的一个扩展库，它为GWT添加了更多的组件和功能，使得开发者能够创建出更富交互性和美观的用户界面。在2.0版本中，Ext GWT引入了许多新特性，提升了性能和可用性...

Global site tag (gtag.js) - Google Analytics