EXTJS内使用ACTIVEX控件引起崩溃问题的解决方法


Posted in Javascript onMarch 31, 2010

问题
在本人目前的项目中,前端部分完全使用EXTJS基于“One-Page”理念搭建。除了一个HTML作为基本容器外,就全是JS文件了(页面是由JS文件实现的)。当用户切换页面时候,我们通过析构上一个页面对象,然后创建新页面对象并展现在HTML中。基于这种架构,我们还引入了一个ActiveX控件,用于展现报表。这一引入,问题就出来了:只要是访问有报表控件存在的页面,用户切换2次页面,IE就会崩溃(FF无此问题),百试不爽。
原因
因为系统设计时考虑到了资源释放,专门处理过析构部分,而且无ActiveX的页面不存在问题。故问题肯定是出在IE对包含在JS中的ActiveX控件释放出了问题。毕竟在传统的以HTML或JSP、PHP页搭建的前端中,ActiveX是属于页面的,只要用户一跳转,页面被Unload,其中的ActiveX也就销毁了;而我们的系统使用的是通过不断的重绘一张HTML页面实现跳转,也就是系统永不会刷新,也就没有Unload,ActiveX自然无法销毁,导致浏览器崩溃。
解决方法
知道了原因,我们就想想法子。既然IE无法帮我们销毁ActiveX控件。我们自己来就好了:

//@AcitveXObjectID: 要查找的节点范围,从此节点一下查找待删除的ActiveX。 
//@ContianerID: 要删除的ActiveX控件ID。 
function ActiveXKiller(AcitveXObjectID,ContianerID){ 
var ce=document.getElementById(ContianerID); 
if (ce){ 
var cce=ce.children; 
for(var i=0;i<cce.length;i=i+1){ 
if(cce[i].id==AcitveXObjectID){ 
ce.removeChild(cce[i]); 
} 
} 
} 
}

这个方法就是用来干掉ActiveX控件的。 原理也简单。就是根据给定的一个节点范围内(一般是ActiveX控件的父节点、容器), 用给定的ActiveX在Dom中的ID来逐级查找,一旦找到就手动Remove。
有了这个Killer,我们就能在页面重绘之前,先搞定ActiveX,避免了崩溃。
另外要提到的,有一个特殊情况。就是当你将一个ActiveX控件放在了一个Ext.Window 里。而天真地想让Ext.Window在关闭的时候顺带帮你把里面的ActiveX也销毁,就必须符合一个条件:
ActiveX的容器必须是Ext.Window本身。
也就是说:如果你将ActiveX控件放在一个Ext.Panel里,然后再放在Ext.Window里。就别指望Ext.Window关闭的时候可以带你的ActiveX控件“一起走”了。
GoodLuck!
Javascript 相关文章推荐
extjs 为某个事件设置拦截器
Jan 15 Javascript
捕获浏览器关闭、刷新事件不同情况下的处理方法
Jun 02 Javascript
jQuery中的val()示例应用
Feb 26 Javascript
js获取input长度并根据页面宽度设置其大小及居中对齐
Aug 22 Javascript
JavaScript实现关键字高亮功能
Nov 12 Javascript
JavaScript中eval()函数用法详解
Dec 14 Javascript
JS与HTML结合使用marquee标签实现无缝滚动效果代码
Jul 05 Javascript
javascript验证内容为数字以及长度为10的简单实例
Aug 20 Javascript
Java与JavaScript中判断两字符串是否相等的区别
Mar 13 Javascript
微信小程序 仿美团分类菜单 swiper分类菜单
Apr 12 Javascript
官方推荐react-navigation的具体使用详解
May 08 Javascript
vue自定义组件实现双向绑定
Jan 13 Vue.js
ExtJS TabPanel beforeremove beforeclose使用说明
Mar 31 #Javascript
十个优秀的Ajax/Javascript实例网站收集
Mar 31 #Javascript
javascript中的107个基础知识收集整理 推荐
Mar 29 #Javascript
jquery CSS选择器笔记
Mar 29 #Javascript
Tinymce+jQuery.Validation使用产生的BUG
Mar 29 #Javascript
javascript delete 使用示例代码
Mar 29 #Javascript
JavaScript 格式字符串的应用
Mar 29 #Javascript
You might like
php 正确解码javascript中通过escape编码后的字符
2010/01/28 PHP
destoon调用企业会员公司形象图片的实现方法
2014/08/21 PHP
php递归法读取目录及文件的方法
2015/01/30 PHP
Yii框架布局文件的动态切换操作示例
2019/11/11 PHP
php获取小程序码的实现代码(B类接口)
2020/06/13 PHP
js tab 选项卡
2009/04/26 Javascript
js 链式延迟执行DOME
2012/01/04 Javascript
Javascript 加载和执行-性能提高篇
2012/12/28 Javascript
jQuery Ajax()方法使用指南
2014/11/19 Javascript
AngularJS基础知识
2014/12/21 Javascript
JS获取Table中td值的方法
2015/03/19 Javascript
详解JavaScript逻辑Not运算符
2015/12/04 Javascript
javascript每日必学之循环
2016/02/19 Javascript
Node.js检测端口(port)是否被占用的简单示例
2016/09/29 Javascript
JS如何判断浏览器类型和详细区分IE各版本浏览器
2017/03/04 Javascript
Node+Express+MongoDB实现登录注册功能实例
2017/04/23 Javascript
详解Angular CLI + Electron 开发环境搭建
2017/07/20 Javascript
浅谈React前后端同构防止重复渲染
2018/01/05 Javascript
JavaScript生成指定范围随机数和随机序列的方法
2018/05/05 Javascript
浅谈React 服务器端渲染的使用
2018/05/08 Javascript
微信小程序 腾讯地图显示偏差问题解决
2019/07/27 Javascript
微信小程序自定义头部导航栏(组件化)
2019/11/15 Javascript
Python中给List添加元素的4种方法分享
2014/11/28 Python
python 重定向获取真实url的方法
2018/05/11 Python
利用Python写一个爬妹子的爬虫
2018/06/08 Python
Python计算IV值的示例讲解
2020/02/28 Python
解析浏览器的一些“滚动”行为鉴赏
2019/09/16 HTML / CSS
recorder.js 基于Html5录音功能的实现
2020/05/26 HTML / CSS
Madewell澳大利亚官方网站:美国休闲服饰品牌
2019/07/18 全球购物
李维斯牛仔裤荷兰官方网站:Levi’s NL
2020/08/23 全球购物
车间班组长岗位职责
2013/11/13 职场文书
绩效专员岗位职责
2013/12/02 职场文书
自强之星事迹材料
2014/05/12 职场文书
员工工作能力评语
2014/12/31 职场文书
高中社区服务活动报告
2015/02/05 职场文书
VUE中的v-if与v-show区别介绍
2022/03/13 Vue.js