在學(xué)習(xí)Flex的過程中你可能會遇到Flex與JavaScript交互的問題，這里和大家分享一下，主要包括Flex調(diào)用JavaScript中的函數(shù)和JavaScript調(diào)用Flex中的函數(shù)兩大部分內(nèi)容。

Flex與JavaScript交互

Flex 與JavaScript 交互，主要依靠Flex的ExternalInterface，其提供了addCallBack和call方法。

◆先來看Flex調(diào)用JavaScript中的函數(shù)

FlexConnectJavaScript.mxml
 

<?xmlversionxmlversion="1.0"encoding="utf-8"?> 
<mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml" 
layout="absolute"> 
<mx:Script> 
<![CDATA[  
importflash.external.*;  
publicfunctioninvokeJavaScript():void  
{  
lblResult.text=ExternalInterface.call("returnTheName","huangxi";  
}  
]]> 
</mx:Script> 
<mx:Buttonidmx:Buttonid="btnConnect"label="調(diào)用JavaScript"click="invokeJavaScript()"x="229"y="204"/> 
<mx:Labelidmx:Labelid="lblResult"text="test"x="205"y="99"width="150"height="80"/> 
</mx:Application> 
 
FlexConnectJavaScript.html中<Script>加入  
functionreturnTheName(a)  
{  
return"HUANGXI";  
}  
////////////////////////  
 

 
小結(jié)

1.ExternalInterface.call("returnTheName","huangxi");其中***個參數(shù)與JavaScript中的函數(shù)相同,第二個參數(shù)為傳遞參數(shù)。

◆再來看JavaScript調(diào)用Flex中的函數(shù)

JavaScriptConnectFlex.mxml
 

<?xmlversionxmlversion="1.0"encoding="utf-8"?> 
<mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml" 
layout="absolute"creationComplete="initApp()"> 
<mx:Script> 
<![CDATA[  
importflash.external.ExternalInterface;  
publicfunctionadd():int  
{  
vari:int;  
varsum:int=0;  
for(i=1;i<=100;i++)  
{  
sum+=i;  
}  
returnsum;  
}  
publicfunctioninitApp():void  
{  
ExternalInterface.addCallback("addTo100",add);  
}  
]]> 
</mx:Script> 
</mx:Application> 
JavaScriptConnectFlex.html中加入  
<buttononclickbuttononclick="addMethod()">計算</button> 
...  
中加入  
functionaddMethod()  
{  
vars=JavaScriptConnectFlex.addTo100();  
alert(s);  
}  
///////////////  

 小結(jié)

1.ExternalInterface.addCallback("addTo100",add);定義JavaScript可以調(diào)用的方法

2.可見JavaScript要調(diào)用Flex函數(shù),Flex要聲明一下;而Flex調(diào)用JavaScript函數(shù)則不需要

【編輯推薦】

1. 學(xué)習(xí)筆記 Flex如何結(jié)合JSP
2. FlexBuilder4十大新特性閃亮登場
3. 學(xué)習(xí)總結(jié) 在Flex中如何嵌入Flex字體
4. Flex框架Riawave的定制應(yīng)用
5. 技術(shù)前沿 Flex2.0 從零開始實現(xiàn)文件上傳