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 相关文章推荐
InnerHtml和InnerText的区别分析
Mar 13 Javascript
jquery JSON的解析方式
Jul 25 Javascript
namespace.js Javascript的命名空间库
Oct 11 Javascript
使用firebug进行调试javascript的示例
Dec 16 Javascript
jQuery使用animate创建动画用法实例
Aug 07 Javascript
jQuery中on方法使用注意事项详解
Feb 15 Javascript
JavaScript学习总结之正则的元字符和一些简单的应用
Jun 30 Javascript
JavaScript闭包原理与用法实例分析
Aug 10 Javascript
如何为vue的项目添加单元测试
Dec 19 Javascript
使用Angular Cli如何创建Angular私有库详解
Jan 30 Javascript
前端路由&amp;webpack基础配置详解
Jun 10 Javascript
vue获取form表单的值示例
Oct 29 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设计模式 Delegation(委托模式)
2011/06/26 PHP
php each 返回数组中当前的键值对并将数组指针向前移动一步实例
2016/11/22 PHP
简单谈谈PHP中的trait
2017/02/25 PHP
PHP设计模式之模板模式定义与用法详解
2018/12/20 PHP
PHP实现单文件、多个单文件、多文件上传函数的封装示例
2019/09/02 PHP
js中格式化日期时间型数据函数代码
2010/11/08 Javascript
javascript实现信息的显示和隐藏如注册页面
2013/12/03 Javascript
提升PHP安全:8个必须修改的PHP默认配置
2014/11/17 Javascript
jQuery事件绑定用法详解(附bind和live的区别)
2016/01/19 Javascript
url传递的参数值中包含&amp;时,url自动截断问题的解决方法
2016/08/02 Javascript
Angular.Js的自动化测试详解
2016/12/09 Javascript
JavaScript html5 canvas实现图片上画超链接
2017/10/20 Javascript
使用nvm管理不同版本的node与npm的方法
2017/10/31 Javascript
webpack构建换肤功能的思路详解
2017/11/27 Javascript
vuex2中使用mapGetters/mapActions报错的解决方法
2018/10/20 Javascript
vue 开发企业微信整合案例分析
2019/12/02 Javascript
从零开始在vue-cli4配置自适应vw布局的实现
2020/06/08 Javascript
[03:12]TI9战队档案 - Virtus Pro
2019/08/20 DOTA
[01:33]PWL开团时刻DAY2-开雾与反开雾
2020/10/31 DOTA
python3实现读取chrome浏览器cookie
2016/06/19 Python
Python利用BeautifulSoup解析Html的方法示例
2017/07/30 Python
python re模块findall()函数实例解析
2018/01/19 Python
python多线程之事件Event的使用详解
2018/04/27 Python
Python(Django)项目与Apache的管理交互的方法
2018/05/16 Python
python mac下安装虚拟环境的图文教程
2019/04/12 Python
python错误调试及单元文档测试过程解析
2019/12/19 Python
keras读取h5文件load_weights、load代码操作
2020/06/12 Python
Unineed旗下时尚轻奢网站:FABHunt
2019/05/13 全球购物
介绍一下sql server的安全性
2014/08/10 面试题
Internal修饰符有什么含义
2013/07/10 面试题
小学校园活动策划
2014/01/30 职场文书
教师自我鉴定范文
2014/03/20 职场文书
教师求职信
2014/06/17 职场文书
2014年学校体育工作总结
2014/12/08 职场文书
忠犬八公的故事观后感
2015/06/05 职场文书
Mysql 一主多从的部署
2022/05/20 MySQL