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 相关文章推荐
Tinymce+jQuery.Validation使用产生的BUG
Mar 29 Javascript
JavaScript继承方式实例
Oct 29 Javascript
jquery 单击li防止重复加载的实现代码
Dec 24 Javascript
AngularJs动态加载模块和依赖注入详解
Jan 11 Javascript
Bootstrap+jfinal实现省市级联下拉菜单
May 30 Javascript
js无提示关闭浏览器窗口的两种方法分析
Nov 06 Javascript
详解React Native开源时间日期选择器组件(react-native-datetime)
Sep 13 Javascript
详解vue-meta如何让你更优雅的管理头部标签
Jan 18 Javascript
npm 下载指定版本的组件方法
May 17 Javascript
node.js实现为PDF添加水印的示例代码
Dec 05 Javascript
解决Layui中templet中a的onclick参数传递的问题
Sep 20 Javascript
关于better-scroll插件的无法滑动bug(2021通过插件解决)
Mar 01 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
Apache, PHP在Windows 9x/NT下的安装与配置 (一)
2006/10/09 PHP
php数组函数序列之asort() - 对数组的元素值进行升序排序,保持索引关系
2011/11/02 PHP
ThinkPHP验证码使用简明教程
2014/03/05 PHP
33道php常见面试题及答案
2015/07/06 PHP
thinkPHP订单数字提醒功能的实现方法
2016/12/01 PHP
jQuery实战之仿淘宝商城左侧导航效果
2011/04/12 Javascript
实现前后端数据交互方法汇总
2015/04/07 Javascript
JS日期加减,日期运算代码
2015/11/05 Javascript
为什么JavaScript没有块级作用域
2016/05/22 Javascript
JavaScript 用fetch 实现异步下载文件功能
2017/07/21 Javascript
JS中用EL表达式获取上下文参数值的方法
2018/03/28 Javascript
JavaScript+H5实现微信摇一摇功能
2018/05/23 Javascript
Electron 打包问题:electron-builder 下载各种依赖出错(推荐)
2020/07/09 Javascript
[48:22]VGJ.S vs VG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
python2 与python3的print区别小结
2018/01/16 Python
Python自定义线程池实现方法分析
2018/02/07 Python
python打包压缩、读取指定目录下的指定类型文件
2018/04/12 Python
python flask几分钟实现web服务的例子
2019/07/26 Python
Django 响应数据response的返回源码详解
2019/08/06 Python
解决pyPdf和pyPdf2在合并pdf时出现异常的问题
2020/04/03 Python
Python3爬虫中关于中文分词的详解
2020/07/29 Python
详解FireFox下Canvas使用图像合成绘制SVG的Bug
2019/07/10 HTML / CSS
HTML5 创建canvas元素示例代码
2014/06/04 HTML / CSS
求高于平均分的学生学号及成绩
2016/09/01 面试题
资料员的岗位职责
2013/11/20 职场文书
创业计划书如何编写
2014/02/06 职场文书
开业庆典策划方案
2014/02/18 职场文书
和解协议书
2014/04/16 职场文书
环境日宣传活动总结
2014/07/09 职场文书
2014法院干警廉洁警示教育思想汇报
2014/09/13 职场文书
解除劳动合同证明书
2014/09/26 职场文书
2015年“世界无车日”活动方案
2015/05/06 职场文书
nginx配置文件使用环境变量的操作方法
2021/06/02 Servers
Springboot使用Spring Data JPA实现数据库操作
2021/06/30 Java/Android
微信小程序 根据不同用户切换不同TabBar
2022/04/21 Javascript
Java实现字符串转为驼峰格式的方法详解
2022/07/07 Java/Android