flex与html交互和js调用

我不是女神ヾ 2022-09-29 12:58 199阅读 0赞

# Flex与Html交互获得参数 #

1. 在html页面包含swf

**这里关键是FlashVars="param1=one&param2=2&param3=3&param4=four"  
这FlashVars把参数传给了swf文件**

2. flex中函数
    
    
    
    private function onCreationComplete() : void
    
    {
      
    
        var parameters : Object = Application.application.parameters;
    
        var param1 : String = parameters.param1;
    
        var param2 : int = parseInt( parameters.param2 );
    
        var param3 : int = parseInt( parameters.param3 );
    
        var param4 : String = parameters.param4;
    
    
    
        output.text = "param1: " + param1 + "/n" +
    
                      "param2: " + param2 + "/n" +
    
                      "param3: " + param3 + "/n" +
    
                      "param4: " + param4;
    
    }

在flex中用Application.application.parameters来获取上面所传的参数
    
    
    
    转自：http://blog.csdn.net/friendyi/archive/2008/07/15/2651777.aspx
    
    
    
    ------------------------------------------------------------------------------------------------------------------

### [Flex与JavaScript的交互][Flex_JavaScript] ###

一、在JavaScript中调用Flex方法  
在 Flex 应用中，需要在方法列表中添加指定的公用方法，这样Flex中的方法才能被JS调用到。在Flex中需要通过调用addCallback()可以把一个方 法添加到此列表中。 addCallback将一个ActionScript的方法注册为一个JavaScript和VBScript可以调用的方法。  
addCallback()函数的定义如下：  
addCallback(function\_name:String, closure:Function):void  
function\_name参数就是在Html页面中脚本调用的方法名。closure参数是要调用的本地方法，这个参数可以是一个方法也可以是对象实例。  
  
  
举个例子：

[view source][] [print][] [?][Link 1]

`01.` `<mx:script>`

`02.` `    ` `import flash.external.*;`

`03.` `    ` `public` `function` `myFunc():Number {`

`04.` `        ` `return` `83;`

`05.` `    ` `}`

`06.` `    ` `public` `function` `initApp():void {`

`07.` `        ` `ExternalInterface.addCallback(` `"myFlexFunction"` `,myFunc);`

`08.` `    ` `}`

`09.` `</mx:script>`

那么在Html页面中，先获得SWF对象的引用，也就是用

[view source][] [print][] [?][Link 1]

`1.` `<` `object` `...id` `=` `"MyFlexApp"` `></` `object` `>`

声明的Swf的Id属性，比如说是MyFlexApp。然后就可以用以下方式调用Flex中的方法。

[view source][] [print][] [?][Link 1]

`1.` `<script language=` `"JavaScript"` `>`

`2.` `    ` `function` `callApp() {`

`3.` `        ` `var` `x = MyFlexApp.myFlexFunction();`

`4.` `        ` `alert(x);`

`5.` `    ` `}`

`6.` `</script>`

[view source][] [print][] [?][Link 1]

`1.` `<` `input` `onclick` `=` `"callApp()"` `value` `=` `"Test"` `type` `=` `"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应用中，添加如下方法：

[view source][] [print][] [?][Link 1]

`01.` `<mx:script>`

`02.`

`03.` `<mx:application xmlns:mx=` `"http://www.adobe.com/2006/mxml "` `>`

`04.` `    ` `<mx:script>`

`05.` `        ` `import flash.external.*;`

`06.` `    `

`07.` `        ` `public` `function` `callWrapper():void {`

`08.` `            ` `var` `f:String =` `"changeDocumentTitle"` `;`

`09.` `            ` `var` `m:String = ExternalInterface.call(f,` `"New Title"` `);`

`10.` `            ` `trace(m);`

`11.` `        ` `}`

`12.` `    ` `</mx:script>`

`13.` `    ` `<mx:button label=` `"Change Document Title"` `click=` `"callWrapper()"` `>`

`14.` `</mx:button></mx:application></mx:script>`

Html页面中有如下函数定义：

[view source][] [print][] [?][Link 1]

`1.` `<script language=` `"JavaScript"` `>`

`2.` `    ` `function` `changeDocumentTitle(a){`

`3.` `        ` `window.document.title = a;`

`4.` `        ` `return` `"successful"` `;`

`5.` `    ` `}`

`6.` `</script>`

转自：http://www.idceye.com/index-blog-view-id216.html
    
    ------------------------------------------------------------------------------------------------------------------------------------

# Flex程序与包装页面（wrapper）通信方法小结 #

Flex通常作为一个web项目的一部分嵌入到一个web页中，因此Flex程序和web页面的通信就变得非常重要。

1）  Flex提供了多种方法实现 Flex程序和封装页面的交互，主要有：flashVars属性，查询字符串参数，navigateToURL()方法，以及flash.external.ExternalInterface类。

2）     Flex程序   获取环境信息： Application.application.url获取封装页面的URL，以及使用 @ContextRoot() ； 以及可以通国 flash.system.Capacities获取到有关系统的一些信息，比如版本、语言、操作系统等；

3）      flashVars用来从外部封装页面向 Flex程序传送数据：

在封装页面传入参数值：AC\_FL\_RunContent(flashVars, “para1=value1&…&paran=valuen”)或者

</Object>

然后flex 程序里通过 Application.application.parameters.para1获取参数值；

4）      ExternalInterface提供方法使 Flex程序和外部的封装页面可以相互调用对方的方法，外部接口类要受到域安全性设置（allowScriptAccess, allowNetworking）的约束。

先判断 ExternalInterface是否可用：

ExternalInterface.available;

flex调用 js：

ExternalInterface.call(funName, funPara1, …, funParaN)；

js调用 flex：

首先 flex里面用ExternalInterface.addCallback(“jsFunName”,asFun),将AS里面定义的函数赋予一个js里面调用的函数的名字jsFunName；

然后在 js里面用mySwf.jsFunName()调用flex里面提供的函数asFun；

ExternalInterface安全性：

一般来说 js和flex的访问局限于同一个域之内。

可以设置 <Object>和<Embed>的allowScriptAccess=”value”(value取值:never, always, sameDomain默认)来设置flex访问js的权限。

至于 js对于flex方法的访问只有flex里面通过addCallback的js才可以访问，对于跨域，可以试用allowDomain()函数设置。

5）      navigateToURL() 可以用来打开一个新的浏览器窗口，也可以用来flex和js之间的通信。比如 :

打开一个新窗口：

var url:URLRequest = new URLRequest( [http://blog.csdn.net][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:zoushun@hotmail.com][mailto_zoushun_hotmail.com] );

navigateToURL(url, \_blank);

转自：http://blog.csdn.net/arshoon/archive/2008/06/11/2533982.aspx

[Flex_JavaScript]: http://pengranxiang.javaeye.com/blog/673666
[view source]: http://www.idceye.com/index-blog-view-id216.html#viewSource
[print]: http://www.idceye.com/index-blog-view-id216.html#printSource
[Link 1]: http://www.idceye.com/index-blog-view-id216.html#about
[http_blog.csdn.net]: http://blog.csdn.net/
[mailto_zoushun_hotmail.com]: mailto:zoushun@hotmail.com