2010-01-20 60 views
0

我有一个简单的HTML文档与flex应用程序和iframe并排(使用1x2表)。如何将Flex的ExternalInterface与IFrame一起使用?

Flex应用程序中有一个按钮,单击它时,通过使用ExnternalInterface.call方法调用JavaScript函数“doNavClick(url)”,将iframe的“src”属性设置为URL。

或者这就是主意。

当我注释掉html中的iframe对象声明时,对doNavClick的调用有效(我弹出警告来测试)....但是当iframe声明存在时,它甚至不会收到呼叫。就好像iframe已经打破了调用调度机制。

有没有这方面的工作?

有问题的代码如下:包含swf应用

--- 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> 

...和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> 

此代码只会弹出一个浏览器提示,其中包含谷歌网址。如果取消注释iframe声明(id为“htmlFrame”)并重新加载页面,则警告不会显示,事实上,JavaScript doNavClick(url)永远不会被调用。

更新:有趣....当我检查index.html的DOM(我用这个萤火虫)身体通常有两个子节点 - 表&脚本。当iframe声明存在时,脚本子消失......这解释了为什么我的ExternalInterface.call永远不会去任何地方。为什么包含iframe会导致我的脚本对象被删除?

UPDATE2:将doNavScript(url)脚本移动到文档的“头部”可修复此问题。就好像iframe声明阻止任何其他孩子成为身体的一部分......我并不是说这就是实际发生的事情,只是这似乎是症状。

+0

不知您DoNavClick ()函数看起来像什么? – DoctorLouie 2010-01-20 23:36:52

+0

我们需要看一些代码。我们需要看看你是如何调用这个函数的,以及页面代码是什么样子的,以及javascript函数的样子是什么 – 2010-01-21 00:02:12

+0

非常正确......代码示例添加了:) – Dan 2010-01-21 15:57:43

回答

1

将javascript代码放置在html文档的<head>部分。

如果有人愿意提供比这个更全面的答案/解释,我会高兴地授予其为“公认的” ......这感觉不对某种程度上接受我自己的答案;)

+0

如果这是正确的答案,尽管我可能会拒绝接受几天,看是否有人解释为什么iframe似乎阻止脚本标记显示,除非它在头标记中。询问头脑想知道。 – invertedSpear 2010-01-21 20:30:37

+0

只是似乎有点自负接受我自己的答案;) 我不知道是否有接受答案的时间限制(如有赏金),但我想打开它,让我或另一个,可以确定地回答这个问题。我所提供的是一个成功的解决方法,而不是解释:) – Dan 2010-01-25 14:59:23