Flex与Javascript相互调用

最新推荐文章于 2024-09-14 18:52:56 发布

zws1987211

最新推荐文章于 2024-09-14 18:52:56 发布

阅读量521

点赞数

分类专栏： Flex JS 文章标签： flex javascript function callback microsoft flash

Flex 同时被 2 个专栏收录

37 篇文章 0 订阅

订阅专栏

3 篇文章 0 订阅

订阅专栏

用FLASH CS3开发,或者在FLEX里建立AS项目开发,与FLEX里建立FLEX项目开发,在对于调用外部的问题,比如ExternalInterface类这个命令:结果一样吗?答案是不一样,这是个很奇怪的问题，其实是源于FLEX在建立的时候内部包含的东西很多,还加了个框架,如果你按照FLASH CS3里开发那样的命令，去调用外部JS,结果会很糟糕.应该说完全不同.

首先来看一下一个简单的CASE,先说FLASH CS3里怎么做,不过这种方法，我已经在http://www.niuc.net/post/206/里写过，很简单.OK,我按照上面那个qq的例子,做一个改变，就是我在网页初始后，就希望得到一个我在JS里写好的值,并且初始化完成后，在FLASH里直接显示.怎么做?

在网页代码里<object>里，加一个JS命令,onLoad="所要执行的程序".然后在里写那个需要执行的程序,比如

< body onLoad="pageInit()" >

然后在script里写上一个初始程序,我是按照以上那个QQ例子来做,那么就该写成

         function pageInit(){
                 callAS3(1);
               }

那么得到的结果是,在网页初始后,FLASH呈现的是穿上编号为1的那个衣服，而不是光着膀子.很简单，对吧,那么问题来了，如果按照同样的方法,在FLEX是否可以实现呢?那么我们来换一种例子来做，只是简单的传输一个字符.我们首先在FLEX里写:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
creationComplete="initApp()">
<mx:Script>
   <![CDATA[
   import flash.external.*;

   public function initApp():void {
       ExternalInterface.addCallback("newMessage",newMessage);
       }

   public function newMessage(s:String):void {
         t.text = s;
      }
   ]]>
</mx:Script>
<mx:Text id="t"/>
</mx:Application>

这样就做好了一个FLEX接受端,可以接受来自外部callApp JS命令,并且把字符在ID为T的text里显示.那么接着写JS端的(需要在FLEX建立完成后，再在BIN里修改那个HTML文件):

<SCRIPT LANGUAGE=“javascript”>
   function callApp() {
       getSWF("TestSwf").newMessage(document.getElementById("newTitle").value);
   }
function getSWF(movieName){
   if (navigator.appName.indexOf("Microsoft") != -1){
       return window[movieName]
   }
   else {
       return document[movieName]
   }
}
</SCRIPT>

<form id="f1">
Enter a new Value: <input type="text" size="30" id="newTitle" >
<input type="button" name="btn" value="SEND" onClick="callApp()">
</form>

看这样就做好了一个很简单的在网页传输数据，并且在FLEX接收的程序了，那么我们继续玩点新花样，我需要在网页初始后,FLEX首先能够显示出我在网页里，或者JS里预加的值,比如:welcome什么的.怎么做?在一开头，我就用FLASH CS3写过,直接在object里放一个onload命令就可以了,但是FLEX能这样做吗?答案是否定的，很多人会被这个问题搞晕,那么到底该如何解决这个问题呢?

其实就是比以前复杂一点，就是多加几个小确认.由于解释起来太麻烦，我就把每行代码都注释一下,先放FLEX端口的Script里的代码,其他的都一样.

<mx:Script>
   <![CDATA[
   import flash.external.*;
   //程序的初始化
   public function initApp():void {
   //监听ExternalInterface.available的Boolean值,一般都为TRUE,如果想知道更详细的情况请参阅帮助文档
     if (ExternalInterface.available){
    //这个值来自与isContainerReady(),而isContainerReady(),的值是来自ExternalInterface.call("isReady");这个命令,这个命令就是写在JS里的，等下我贴JS代码的时候会放上,如果JS里的值返回是true,那么继续下面的Callback命令.
         var containerReady:Boolean = isContainerReady();
         if (containerReady) {
           Callback();
         }
     }else{
       trace("Wrong Load!")
     }
       }
       private function isContainerReady():Boolean{
           var result:Boolean = ExternalInterface.call("isReady");
           return result;
   }
   private function Callback():void {
//这里就简单多了，先addCallback好准备要接收的东西,然后call JS里的命令,以便从JS发送一个值回来,注意次序不要搞错，错了就会不成功
      ExternalInterface.addCallback("newMessage",newMessage);
         ExternalInterface.call("sendMessage");
   }

   public function newMessage(s:String):void {
         t.text = s;
      }
   ]]>
</mx:Script>