JavaScript调用flash.external.ExternalInterface.addCallback注册的函数在不同浏览器下的分析
JavaScript在调用flash中使用flash.external.ExternalInterface.addCallback注册的回调函数时,不同浏览器使用的容器对象,和swf文件放置的位置和是否显示有很大关系,如果未设置对,会找不到flash中注册的回调函数。
测试浏览器:IE6,IE7,IE8,Firefox3.6,谷歌chrome 14.0.835.202 m
AS脚本
function loadPicture(){ //......代码...... //......代码...... } flash.external.ExternalInterface.addCallback("forJS", null, loadPicture);//注册JavaScript中调用的回调函数
输出swf到html页面的JS脚本,swf的ID为swfId
document.write('<div class="dvswf">' + (document.all ? '<object id=swfId classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000><param name="src" value="/images/loadSwf.swf"></object>' : '<embed id="swfId" type="application/x-shockwave-flash" src="/images/loadSwf.swf"/>') + '</div>');
1)JavaScript如何获取flash中flash.external.ExternalInterface.addCallback注册的函数,参考此文章
2)swf的位置和显示问题
A)swf元素的display不能设置为none或者容器的display也不能为none,要不找不到注册的方法,测试代码如下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=gb2312"> <style type="text/css"> .dvswf{display:none;} </style> </head> <body> <script type="text/javascript"> document.write('<div class="dvswf">' + (document.all ? '<object id=swfId classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000><param name="src" value="/images/loadSwf.swf"></object>' : '<embed id="swfId" type="application/x-shockwave-flash" src="/images/loadSwf.swf"/>') + '</div>'); </script> <script type="text/javascript"> function $(Id){return document.getElementById(Id);} function getFlashMethod(swfID) {//获取 if (window[swfID] && window[swfID].forJS) return window[swfID] if (document[swfID] && document[swfID].forJS) return document[swfID] if ($(swfID).forJS) return $(swfID) return false; } function getcontainer() { var o = getFlashMethod('swfId'); alert(o)//全部输出为false } </script> <input type="button" value="获取swf容器" onclick="getcontainer()" /><br /> </body> </html>
上面为什么getFlashMethod返回的是容器而不是直接返回注册forJS回调函数,是因为返回forJS的话在Firefox下执行此返回的函数会出现“NPMethod called on non-NPObject wrapped JSObject”错误,具体参考firefox NPMethod called on non-NPObject wrapped JSObject!错误
解决办法就是设置div容器的position为absolute不占用文档内容,left和top设置为负值,不显示在可见区域
.dvswf{ position:absolute;left:-100000px;top:-10000px;}
B)不能在head标签中输出swf,要不IE浏览器获取不到flash中flash.external.ExternalInterface.addCallback注册的函数,测试代码如下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=gb2312"> <style type="text/css"> /*.dvswf{display:none;}*/ </style> <script type="text/javascript"> document.write('<div class="dvswf">' + (document.all ? '<object id=swfId classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000><param name="src" value="/images/loadSwf.swf"></object>' : '<embed id="swfId" type="application/x-shockwave-flash" src="/images/loadSwf.swf"/>') + '</div>'); </script> </head> <body> <script type="text/javascript"> function $(Id){return document.getElementById(Id);} function getFlashMethod(swfID) {//获取 if (window[swfID] && window[swfID].forJS) return window[swfID] if (document[swfID] && document[swfID].forJS) return document[swfID] if ($(swfID).forJS) return $(swfID) return false; } function getcontainer() { var o = getFlashMethod('swfId'); alert(o)//IE浏览器输出flase,Firefox和chrome能获取到对应的swf容器 } </script> <input type="button" value="获取swf容器" onclick="getcontainer()" /><br /> </body> </html>
C)如果使用jquery框架,不能使用appendTo,append,html方法添加flash文件,要不IE无法获取到flash中flash.external.ExternalInterface.addCallback注册的函数,可以用jquery框架获取DOM元素后设置DOM元素的innerHTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=gb2312"> <style type="text/css"> .dvswf{ position:absolute;left:-100000px;top:-10000px;} </style><script type="text/javascript" src="js/jquery.js"></script> </head> <body> <div id="dvswf" class="dvswf"></div> <script type="text/javascript"> var swfHTML = document.all ? '<object id=swfId classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000><param name="src" value="/images/loadSwf.swf"></object>' : '<embed id="swfId" type="application/x-shockwave-flash" src="/images/loadSwf.swf"/>'; $(function () { $('#dvswf').get(0).innerHTML = swfHTML;//0 /* $(swfHTML).appendTo('#dvswf');//1 $('#dvswf').html(swfHTML);//2 $('#dvswf').append(swfHTML);//3 */ }); </script> <script type="text/javascript"> function _$(Id) { return document.getElementById(Id); } function getFlashMethod(swfID) {//获取 if (window[swfID] && window[swfID].forJS) return window[swfID] if (document[swfID] && document[swfID].forJS) return document[swfID] if (_$(swfID).forJS) return _$(swfID) return false; } function getcontainer() { var o = getFlashMethod('swfId'); alert(o)//只有第0种方法IE才能获取到swf容器,1,2,3IE都无法获取到 } </script> <input type="button" value="获取swf容器" onclick="getcontainer()" /><br /> </body> </html>
加支付宝好友偷能量挖...
原创文章,转载请注明出处:JavaScript调用flash.external.ExternalInterface.addCallback注册的函数在不同浏览器下的分析