1. 首頁
  2. »
  3. 網頁開發
  4. »
  5. Flex
  6. »
  7. Flex教學-Flex與Javascript相互傳值

Flex教學-Flex與Javascript相互傳值

2009/08/05

梅問題-flex教學-Flex與javascript相互溝通

  以前用Flash時,常透過Flash來呼叫網頁中的javscript函數,且方法相當的簡易,只要用getURL(“javascript:xxx,就可直接相互的溝通使用,原本想說Flex發佈後也是swf,用法應該也是一樣,結果~殘念,不可將子用滴!於是梅干花了點時間,上網找了些資料,並實際測試終於搞懂了二者的溝通方式,並稍作整理製作成簡易的範例,各位若有需要時,不仿可以參考一下。


Flex呼叫Javascript:
FlexCallJS.mxml(script):

mx:Script

import flash.external.*;
import mx.controls.Alert;

public function javascriptAlert():void{
var javascriptFunction:String = “showAlert”;
var message:String = messageText.text;

if(ExternalInterface.available){
ExternalInterface.call(javascriptFunction, message);
}
}

/mx:Script


FlexJS.html(script):



這邊需注意到,在mxml中:
javascriptFunction:String = “showAlert“;為javascript中的function名稱,二者需相同。
message為參數內容,這邊可依需求自行設定。

範例預覽:


[範例下載]

※解壓密碼:minwt.com


Javascript呼叫Flex:
JSCallFlex.mxml(script):

mx:Script

import mx.controls.Alert;
import flash.external.ExternalInterface;

public function initApp():void{
if(ExternalInterface.available){
ExternalInterface.addCallback(“alertshow”, alertshow);
}
}

public function alertshow(msg:String,msg2:String):void{
//mx.controls.Alert.show(msg);
this.lb1.text=msg;
this.lb2.text=msg2;
}

/mx:Script


JSCallFlex.html(script):




var attributes = {id:”JSCallFlex”};:要給swf一個id名稱。

getFlexApp(‘JSCallFlex’).alertshow(msg,msg2);中的JSCallFlex為swf名稱內的函數叫alertshow,(msg,msg2)為接收的參數內容。

範例預覽:


[範例下載]

※解壓密碼:minwt.com


  先前的jQuery滑入播放影片,就是利用javascript去呼叫Flex中function,將檔案與尺寸大小丟給它,再進行播放滴!呵~很好玩吧!