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 相关文章推荐
js 居中漂浮广告
Mar 21 Javascript
javascript中substr,substring,slice.splice的区别说明
Nov 25 Javascript
限制文本框只能输入数字||只能是数字和小数点||只能是整数和浮点数
May 27 Javascript
select隐藏选中值对应的id,显示其它id的简单实现方法
Aug 25 Javascript
javascript中的后退和刷新实现方法
Nov 10 Javascript
JS解析url查询参数的简单代码
Aug 06 Javascript
JS遍历DOM文档树的方法实例详解
Apr 03 Javascript
layui结合form,table的全选、反选v1.0示例讲解
Aug 15 Javascript
详解JavaScript的内存空间、赋值和深浅拷贝
Apr 17 Javascript
如何通过JS实现转码与解码
Feb 21 Javascript
Vue 技巧之控制父类的 slot
Feb 24 Javascript
nginx配置域名后的二级目录访问不同项目的配置操作
Nov 06 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
定位地理位置PHP判断员工打卡签到经纬度是否在打卡之内
2019/05/23 PHP
laravel 出现command not found问题的解决方案
2019/10/23 PHP
学习jquery必备 api中英文对照的chm手册 下载
2007/05/03 Javascript
通过javascript的匿名函数来分析几段简单有趣的代码
2010/06/29 Javascript
jQuery中调用WebService方法小结
2011/03/28 Javascript
js hover 定时器(实例代码)
2013/11/12 Javascript
js call方法详细介绍(js 的继承)
2013/11/18 Javascript
用jquery等比例控制图片宽高的具体实现
2014/01/28 Javascript
javascript通过元素id和name直接取得元素的方法
2015/04/28 Javascript
javascript实现拖动元素交换位置
2015/11/29 Javascript
Bootstrap Table服务器分页与在线编辑应用总结
2016/08/08 Javascript
前端框架Vue.js中Directive知识详解
2016/09/12 Javascript
Bootstrap CSS布局之列表
2016/12/15 Javascript
JS基于正则截取替换特定字符之间字符串操作示例
2017/02/03 Javascript
详解Node.js中exports和module.exports的区别
2017/04/19 Javascript
在vue中使用jointjs的方法
2018/03/24 Javascript
Vue.js@2.6.10更新内置错误处机制Fundebug同步支持相应错误监控
2019/05/13 Javascript
vue 组件内获取actions的response方式
2019/11/08 Javascript
[50:02]完美世界DOTA2联赛循环赛 Magma vs IO BO2第一场 11.01
2020/11/02 DOTA
学习python之编写简单乘法口诀表实现代码
2016/02/27 Python
Django中的文件的上传的几种方式
2018/07/23 Python
python 读取摄像头数据并保存的实例
2018/08/03 Python
Python 加密与解密小结
2018/12/06 Python
python实现逐个读取txt字符并修改
2018/12/24 Python
pandas中DataFrame修改index、columns名的方法示例
2019/08/02 Python
Python 批量刷博客园访问量脚本过程解析
2019/08/30 Python
Python使用sqlite3模块内置数据库
2020/05/07 Python
python使用dlib进行人脸检测和关键点的示例
2020/12/05 Python
德国家用电器购物网站:Premiumshop24
2019/08/22 全球购物
3个CCIE对一个工程师的面试题
2012/05/06 面试题
C#公司笔试题
2014/03/28 面试题
什么是lambda函数
2013/09/17 面试题
名人演讲稿范文
2013/12/28 职场文书
文体活动实施方案
2014/03/27 职场文书
总经理助理岗位职责
2015/01/31 职场文书
pytorch中的model.eval()和BN层的使用
2021/05/22 Python