關於Flash和JS相互呼叫的例子
關於Flash和JS相互呼叫的例子已經說很多了,這不是難題,當然,呼叫錯誤這也不是Flash和JS的錯誤,我們今天就來徹底解決IE,FF和Chrome之間的不相容問題!
我們知道,Flash中,如果訪問外部JS函式,只需 flash.external.ExternalInterface.call(“JS中的函式名”);這一句即可
如果要JS訪問Flash中的函式,需要用addCallBack註冊一個回撥函式,讓JS去呼叫(AS2例子)
import flash.external.*; var methodName:String = "SetImgPath";//JS需要呼叫的函式名字var instance:Object = null; var method:Function = extractstr;//Flash中實際的函式名字,引數忽略,但是你呼叫的時候要記得有引數的要加上 var wasSuccessful:Boolean = ExternalInterface.addCallback(methodName, instance, method); trace(wasSuccessful+"-callback")
我們可以trace一下,這個時候如果是true,表示註冊成功
OK,下面web中試用一下:
<div style="margin-left :50px; margin-bottom:50px"><input type="text" id="mytxt" border="1" value="這是測試框,呼叫頁面JS演示" style="width:200px"/></div>
<div id="flashContent">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="515" height="320" id="123" align="middle">
<param name="movie" value="123.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="123.swf" width="515" height="320"><!--下面針對非IE核心瀏覽器-->
<param name="movie" value="123.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="transparent" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<![endif]-->
<a href="upload/2011/1/201101281000491420.gif" alt="獲得 Adobe Flash Player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
OK,我們在Web中加一個button來呼叫這個flashcall:<input type="button" onclick="flashcall('./image/1.jpg')" value="JS呼叫SWF">
測試一下:
IE6,7,8,9一切正常
FF:失敗
Chrome:失敗
失敗原因:SetImgPath不是函式,(is not a function /not defined)
這就很奇怪了,我們可以用一個alert,來輸出thisMovie("123"):alert(thisMovie("123"));
輸出結果並不是Null,說明已經找到了我們的Flash,但是為啥FF和Chrome就總是找不到函式呢?
逛了各大論壇,比較一致的說法是addCallback必須要是flash載入完畢才能註冊成功,好吧,我們加一個settimeout函式,判斷是否載入成功,我們改一下上面的flashcall:
function flashcall(str){
try{
thisMovie("123").SetImgPath(str);//注意,123是上面的ID,而SetImgPath是我們Flash中的註冊的回撥函式
}cache(e){
settimeout("flashcall(str)",100 );
}
}
恩,我們用個settimeout,每隔100毫秒去呼叫一次,如果異常就持續呼叫,直到成功為止!
遺憾的是,始終不成功,程式進入死迴圈!
通過查閱各種資料,終於找到了原因:
FF中瀏覽器只認識embed標記,所以如果你用getElementById獲 flash的時候,需要給embed做ID標記,而IE是認識object標記的 ,所以你需要在object上的ID做上你的標記
明白了嗎?原來在FF和Chrome中,Flash必須用embed才能識別出他的ID,用Object標籤是無法識別ID的,我用的Html是Flash自動生成的,都是Object標籤,害我除錯了一個下午,才明白原來問題出在這裡。
知道原因了,就好處理了,改標籤:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="515" height="320" id="123" title="123" align="middle">
<param name="allowScriptAccess" value="always" />
<param name="movie" value="123.swf">
<param name="quality" value="high">
<param name="wmode" value="transparent" />
<embed src="123.swf" name="123" quality="high" allowScriptAccess="always" swLiveConnect="true" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="515" height="320"></embed>
</object>
把嵌入Flash的標籤改為上面的,一切OK!