[心得教程] Flex与 JS 交互通信方法

心得教程类型:

 

navigateToURL() 可以用来打开一个新的浏览器窗口，也可以用来flex和js之间的通信。比如:
打开一个新窗口：
   var url:URLRequest = new URLRequest(http://blog.csdn.net);
   navigateToURL(url, _blank);
这个函数也可以用来执行js，例如：
   var url:URLRequest = new URLRequest(“javascript:window.close()”); 或者：
   var urlLURLRequest = new URLRequest(“javascript:myFun(para1…paran)”)
   myFun()函数是html页面的script部分定义的，函数参数一定要有引号！
   navigateToURL(url, _self);
也可以用来发送email：
   var urlURLRequest = new URLRequest(mailto:[e-mail]);
   navigateToURL(url, _blank);

//------------------------------------------------------------------------------------

internal function initApp():void   {
      var str:String = "<a target='_blank' href='...'>message here</a>";
      link.htmlText = str;
    }
internal function openUrl():void   {
      navigateToURL(new URLRequest("..."), "_blank");
    }<mx:Button x="72" y="117" label="message" fontSize="13" id="link2" click="openUrl()"/>


JS与Flex交互的几点注意事项

一，在Flex中，addCallack所输出供给JS调用的函数名称不能与JS中己有的函数名称相重复，如下所示:
ExternalInterface.addCallback("play",callThis);
上面这一句在IE中就发生错误，因为“play”这个函数名称已经被分配给DOM元素了，改一个名字就可以了，如下就正确了。

ExternalInterface.addCallback("MyPlay",callThis);
二，在向页面中嵌入swf文件时，要用Adobe的官方JS文件或者版本为2.+的SWFOBJECT。
Adobe的官方JS文件就是AC_OETags.js文件,如果你用的是Flex SDK，可以在Flex SDK安装目录下的templates文件夹中找。在用AC_OETags.js文件时,请把下面这段代码加入到页面中:

function getMovie(movieName){    if (navigator.appName.indexOf("Microsoft")!=-1){    return window[movieName];    } else {    return document[movieName];    }}
用下面的代码调用Flex中的命令:

getMovie('MyFlex').MyPlay();
如果使用的是SWFOBJECT，请使用2.0或2.0以上的版本，使用方法可以查看《翻译：SWFOBJECT 2.0官方文档》，然后使用如下语句调用Flex中的命令：

swfobject.getObjectById("MyFlex").MyPlay();
三，Flex中调用“init()”语句的命令最好放在“applicationComplete”中。
因为有时JS调用Flex的命令中需要用到Flex的组件做出反应，如果用creationComplete 调用“init()”有可能会发错，所以最好是用applicationComplete。creationComplete是在组件定义完成并已经在显示列表时触发，而applicationComplete是在所有的组件初始化完成并显示时触发。
四，注意页面文件编码格式即文件的encoding类型，这个本来不算问题的,但却让我碰到了，文件编码格式不对称有时在IE中显示不了内容。  一、在JavaScript中调用Flex方法在Flex中可以用ExternalInterface来调用Flex的方法，途径是1.通过在Flex应用可调用方法列表中添加指定的公用方法。在Flex应用中通过调用addCallback()可以把一个方法添加到此列表中。addCallback将一个ActionScript的方法注册为一个JavaScript和VBScript可以调用的方法。addCallback()函数的定义如下：addCallback(function_name:String, closure:Function):voidfunction_name参数就是在Html页面中脚本调用的方法名。closure参数是要调用的本地方法，这个参数可以是一个方法也可以是对象实例。举个例子：<mx:Script>     import flash.external.*;     public function myFunc():Number {         return 42;     }     public function initApp():void {         ExternalInterface.addCallback("myFlexFunction",myFunc);     }</mx:Script>2.那么在Html页面中，先获得SWF对象的引用，也就是用<object .../>声明的Swf的Id属性，比如说是MyFlexApp。然后就可以用以下方式调用Flex中的方法。<SCRIPT language='JavaScript' charset='utf-8'>     function callApp() {         var x = MyFlexApp.myFlexFunction();         alert(x);     }</SCRIPT><button onclick="callApp()">Call App</button> 二、在Flex中调用 JavaScript你 可以调用Html页面中的JavaScript，通过与JavaScript的交互，可以改变Style，调用远程方法。还可以将数据传递给Html页 面，处理后再返回给Flex，完成这样的功能主要有两种方法：ExternalInterface()和navigateToUrl()。在Flex中调用JavaScript最简单的方法是使用ExternalInterface()，可以使用此API调用任意JavaScript，传递参数，获得返回值，如果调用失败，Flex抛出一个异常。ExternalInterface封装了对浏览器支持的检查，可以用available属性来查看。ExternalInterface的使用非常简单，语法如下：flash.external.ExternalInterface.call(function_name: String[, arg1, ...]):Object;参数function_name是要调用的JavaScript的函数名，后面的参数是JavaScript需要的参数。举个例子说明如何调用JavaScript函数Flex应用中，添加如下方法：<mx:Script><?xml version="1.0" encoding="iso-8859-1"?><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">     <mx:Script>         import flash.external.*;              public function callWrapper():void {             var f:String = "changeDocumentTitle";             var m:String = ExternalInterface.call(f,"New Title");             trace(m);          }     </mx:Script>     <mx:Button label="Change Document Title" click="callWrapper()"/></mx:Application>Html页面中有如下函数定义：<SCRIPT LANGUAGE="JavaScript">     function changeDocumentTitle(a) {         window.document.title=a;         return "successful";     }</SCRIPT>