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 相关文章推荐
!DOCTYPE声明对JavaScript的影响分析
Apr 12 Javascript
Javascript模块化编程(三)require.js的用法及功能介绍
Jan 17 Javascript
2则自己编写的jQuery特效分享
Feb 26 Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(一)
Feb 16 Javascript
深入分析node.js的异步API和其局限性
Sep 05 Javascript
原生js实现放大镜效果
Jan 11 Javascript
jQuery AJAX 方法success()后台传来的4种数据详解
Aug 08 jQuery
vue-router动态设置页面title的实例讲解
Aug 30 Javascript
Vue项目中最新用到的一些实用小技巧
Nov 06 Javascript
在vue中使用express-mock搭建mock服务的方法
Nov 07 Javascript
ES6中Set和Map数据结构,Map与其它数据结构互相转换操作实例详解
Feb 28 Javascript
vue学习笔记之给组件绑定原生事件操作示例
Feb 27 Javascript
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
使两个iframe的高度与内容自适应,且相等
2006/11/20 Javascript
JS的get和set使用示例
2014/02/20 Javascript
jquery实现html页面 div 假分页有原理有代码
2014/09/06 Javascript
用C/C++来实现 Node.js 的模块(一)
2014/09/24 Javascript
jQuery中extend函数的实现原理详解
2015/02/03 Javascript
解析JavaScript的ES6版本中的解构赋值
2015/07/28 Javascript
javascript常用经典算法实例详解
2015/11/25 Javascript
有关JavaScript中call()和apply() 的一些理解
2016/05/20 Javascript
关于javascript原型的修改与重写(覆盖)差别详解
2016/08/31 Javascript
Vue.js实现无限加载与分页功能开发
2016/11/03 Javascript
微信小程序 弹窗自定义实例代码
2017/03/08 Javascript
jQuery实现动态添加、删除按钮及input输入框的方法
2017/04/27 jQuery
微信小程序 生命周期函数详解
2017/05/24 Javascript
Vue0.1的过滤代码如何添加到Vue2.0直接使用
2017/08/23 Javascript
vue+Element-ui实现分页效果实例代码详解
2018/12/10 Javascript
vue页面加载时的进度条功能(实例代码)
2020/01/13 Javascript
Python实现快速多线程ping的方法
2015/07/15 Python
Python中time模块和datetime模块的用法示例
2016/02/28 Python
Python中类的初始化特殊方法
2017/12/01 Python
matplotlib.pyplot绘图显示控制方法
2019/01/15 Python
简单了解python元组tuple相关原理
2019/12/02 Python
在python3中实现更新界面
2020/02/21 Python
Pyqt5 关于流式布局和滚动条的综合使用示例代码
2020/03/24 Python
Pycharm及python安装详细教程(图解)
2020/07/31 Python
Python grequests模块使用场景及代码实例
2020/08/10 Python
ManoMano英国:欧洲第一家专注于DIY和园艺市场的电商平台
2020/03/12 全球购物
六十大寿答谢词
2014/01/12 职场文书
《理想》教学反思
2014/02/17 职场文书
成立公司计划书
2014/05/07 职场文书
效能风暴心得体会
2014/09/04 职场文书
幼儿园感恩节活动方案2014
2014/10/11 职场文书
计算机考试作弊检讨书1000字
2015/01/01 职场文书
鲁迅故里导游词
2015/02/05 职场文书
计算机实训心得体会
2016/01/14 职场文书
浅谈Python数学建模之数据导入
2021/06/23 Python
详解overflow:hidden的作用(溢出隐藏、清除浮动、解决外边距塌陷)
2021/07/01 HTML / CSS