如何将 Flex 的外部接口与 IFrame 结合使用？
我有一个简单的 html 文档，其中并排有一个 Flex 应用程序和一个 iframe（使用 1x2 表格）。
Flex 应用程序中有一个按钮，单击该按钮时，通过使用 ExnternalInterface.call 方法调用 javascript 函数“doNavClick(url)”，将 iframe 的“src”属性设置为 URL。
或者就是这个想法。
当我注释掉 html 中的 iframe 对象声明时，对 doNavClick 的调用有效（我弹出一个警报进行测试）......但是当 iframe 声明存在时，它甚至没有收到调用。就好像 iframe 以某种方式破坏了呼叫调度机制。
有解决方法吗？
有问题的代码如下：
--- Main.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
paddingLeft="0" paddingRight="0"
paddingTop="0" paddingBottom="0"
>
<mx:Script>
<![CDATA[
import flash.events.MouseEvent;
private function doNavClick(event:MouseEvent):void
{
if (ExternalInterface.available)
{
var url:String = "http://www.google.com"
ExternalInterface.call("doNavClick", url); // Problematic with iframes
}
else
{
mx.controls.Alert.show("External interface not available");
}
}
]]>
</mx:Script>
<mx:VBox width="100%" height="100%">
<mx:Button label="Google" click="doNavClick(event)"/>
</mx:VBox>
</mx:Application>
...以及包含 swf 应用程序的 html/JavaScript 代码：
--- index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>My SWF Project</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
swfobject.registerObject("mySWFProj", "9.0.0");
</script>
<style>
html, body, div { height: 99%; }
</style>
</head>
<body>
<table border="1" width="100%" height="100%">
<tbody>
<tr>
<td style="width: 25%; height: 100%">
<div style="width: 100%; height: 100%">
<object id="mySWFProj" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%">
<param name="allowscriptaccess" value="always" />
<param name="allowfullscreen" value="true" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="mySWFProj.swf" width="100%" height="100%">
<param name="allowscriptaccess" value="always" />
<param name="allowfullscreen" value="true" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</td>
<td style="width: 75%; height: 100%">
<div style="width: 100%; height: 100%">
<!-- <iframe id="htmlFrame" width="100%" height="100%" src="http://www.amazon.com"> -->
</div>
</td>
</tr>
</tbody>
</table>
<script type="text/javascript">
function doNavClick(url)
{
alert(url);
//document.getElementById('htmlFrame').src = url;
}
</script>
</body>
</html>
此代码将简单地弹出一个浏览器警报，其中包含 google url。如果您取消注释 iframe 声明（ID 为“htmlFrame”）并重新加载页面，则不会显示警报，事实上，JavaScript doNavClick(url) 永远不会被调用。
更新：有趣......当我检查index.html的DOM时（我为此使用firebug），主体通常有两个子节点 - table 和 table 。脚本。当存在 iframe 声明时，子脚本就会消失......这解释了为什么我的ExternalInterface.call永远不会去任何地方。为什么包含 iframe 会导致我的脚本对象被删除？
UPDATE2 ：将 doNavScript(url) 脚本移动到文档的“头部”可以解决此问题。就好像 iframe 声明阻止任何其他孩子成为身体的一部分......我并不是说这就是实际发生的事情，只是这似乎是症状。
I have a simple html doc with a flex app and an iframe side-by-side (using a 1x2 table).
There is a button in the flex app that, when clicked, sets the "src" property of the iframe to a URL by using the ExnternalInterface.call method to call a javascript function "doNavClick(url)".
Or that's the idea.
When I comment out the iframe object declaration in the html, the call to doNavClick works (I pop up an alert to test)....yet when the iframe declaration is present, it doesn't even receive the call. It's as if the iframe has somehow broken the call dispatching mechanism.
Is there a workaraound for this?
The problematic code is as follows:
--- Main.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
paddingLeft="0" paddingRight="0"
paddingTop="0" paddingBottom="0"
>
<mx:Script>
<![CDATA[
import flash.events.MouseEvent;
private function doNavClick(event:MouseEvent):void
{
if (ExternalInterface.available)
{
var url:String = "http://www.google.com"
ExternalInterface.call("doNavClick", url); // Problematic with iframes
}
else
{
mx.controls.Alert.show("External interface not available");
}
}
]]>
</mx:Script>
<mx:VBox width="100%" height="100%">
<mx:Button label="Google" click="doNavClick(event)"/>
</mx:VBox>
</mx:Application>
...and the html/JavaScript code containing the swf app:
--- index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>My SWF Project</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
swfobject.registerObject("mySWFProj", "9.0.0");
</script>
<style>
html, body, div { height: 99%; }
</style>
</head>
<body>
<table border="1" width="100%" height="100%">
<tbody>
<tr>
<td style="width: 25%; height: 100%">
<div style="width: 100%; height: 100%">
<object id="mySWFProj" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%">
<param name="allowscriptaccess" value="always" />
<param name="allowfullscreen" value="true" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="mySWFProj.swf" width="100%" height="100%">
<param name="allowscriptaccess" value="always" />
<param name="allowfullscreen" value="true" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</td>
<td style="width: 75%; height: 100%">
<div style="width: 100%; height: 100%">
<!-- <iframe id="htmlFrame" width="100%" height="100%" src="http://www.amazon.com"> -->
</div>
</td>
</tr>
</tbody>
</table>
<script type="text/javascript">
function doNavClick(url)
{
alert(url);
//document.getElementById('htmlFrame').src = url;
}
</script>
</body>
</html>
This code will simply pop up a browser alert with the google url in it. If you uncomment the iframe declaration (with id "htmlFrame") and reload the page, the alert doesn't show, in fact, the JavaScript doNavClick(url) never gets called.
UPDATE: Interesting....when I examine the DOM of index.html (I use firebug for this) the body usually has two child nodes - table & script. When the iframe declaration is present, the script child disappears...which explains why my ExternalInterface.call never goes anywhere. Why does the inclusion of an iframe cause my script object to be removed?
UPDATE2 : Moving the doNavScript(url) script into the "head" of the document fixes this problem. It is as if the iframe declaration prevents any other children being part of the body...I'm not saying that this is what is actually happening, only that this appears to be the symptom.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
将 javascript 代码放置在 html 文档的
部分。如果有人希望提供比这更完整的答案/解释，我会很乐意将其授予“已接受”......接受我自己的答案感觉有点不对；）
Place javascript code in the
<head>section of the html document.If anyone wishes to offer a fuller answer/explanation than this, I'll happily award it as "accepted"....it feels wrong somehow to accept my own answer ;)