flex与JS互相调用

发布时间：2020-12-15 03:41:40 所属栏目：百科来源：网络整理

导读：网上这方面资料比较多，flex调用JS的比较简单，可以查看http://www.cnblogs.com/tiandi/archive/2012/06/03/2532977.html，其具体内容如下： 1.flex调用js方法调用方法例如：ExternalInterface.call("UploadComplete",oldName,uidName,_dir+"/"+uidName+typ

网上这方面资料比较多，flex调用JS的比较简单，可以查看http://www.cnblogs.com/tiandi/archive/2012/06/03/2532977.html，其具体内容如下：

1.flex调用js方法

调用方法例如：ExternalInterface.call("UploadComplete",oldName,uidName,_dir+"/"+uidName+type);

第一个是js方法名，后面几个是给这个js方法传的参数。这个方法必须在网页的js中注册，否则会调用失败。

需要注意的是调用之前需要检查网页的js是否已完成加载，用ExternalInterface.available可是判断。

注：这种调用方法是可以有返回值的，例如：var m:String = ExternalInterface.call(f,"New Title");

???? ?但是这个返回值不能有时延（例如js需要进行ajax操作），否则m=null。因为flex是异步的。

复制代码

<mx:Script>
<?xml version="1.0" encoding="iso-8859-1"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
        import flash.external.*;
    
        public function callWrapper():void {
            var f:String = "changeDocumentTitle";
            var m:String = ExternalInterface.call(f,"New Title");
            trace(m);
        }
    </mx:Script>
    <mx:Button label="Change Document Title" click="callWrapper()"/>
</mx:Application>
Html页面中有如下函数定义：
<SCRIPT LANGUAGE="JavaScript">
    function changeDocumentTitle(a) {
        window.document.title=a;
        return "successful";
    }
</SCRIPT>

复制代码

这个直接可以测试成功。

2、js调用flex：

js要调用flex方法，首先在flex中必须注册，将as方法注册为js可调用的方法。例如：ExternalInterface.addCallback("ConfirmGroup",ConfirmGroup);

第一个是js中调用时用的名称，第二个是as中定义的方法。

在ie浏览器中调用方法为：?document.getElementById("mapContent").ConfirmGroup(1);?

mapContent为flash的id。

?注：它也是可以有返回值的。

示例：

AS:

复制代码

<mx:Script>
    import flash.external.*;
    function myFunc():Number {
        return 42;
    }
    function initApp():void {
        ExternalInterface.addCallback("myFlexFunction",myFunc);
    }
</mx:Script>

复制代码

JS:

复制代码

<SCRIPT language='JavaScript' charset='utf-8'>
    function callApp() {
        var x = MyFlexApp.myFlexFunction();
        alert(x);
    }
</SCRIPT>
<button onclick="callApp()">Call App</button>

复制代码

经常会出现undefined或者是null的异常，无法调试成功。在网上找了各种资料后，有人也遇到过这个问题，比较靠谱的原因是http://bbs.csdn.net/topics/320197922里说的接口不通的问题，解决方案：使用swfObject.js的类库。关键代码如下：??????

JavaScript code 
   
?

 
      
        ??? 
       
 
        var? 
        so?=? 
        new? 
        SWFObject( 
        "test.swf" 
        ,? 
        "flexObject" 
        "100%" 
        "7" 
        "#336699" 
        ); 
       
 
        ? 
        so.write( 
        "divChart" 
        ); 
       
 
    

这段代码中divChart是一个层。

flex关键源码：

public function asFunc():String {
				Alert.show("asFunc","asFunc",4);
				return "hello";
			}
			
			public function initApp():void {
				//AddCallback方法允许javascript调用flash时间上函数 
				ExternalInterface.addCallback("flexFunctionAlias",asFunc);
			}

js关键源码：

<script type="text/javascript" src="js/swfobject.js"></script>

function initFlex() {
		// 然后下面的代码就可以执行Flex里面的脚本了
		 swfobject.embedSWF("<%=request.getContextPath()%>/module/guard/video1.swf","divChart","100%","7","#336699");
	    }

	    function callApp()
	    {
	    	var ax = getSWFObject('divChart').flexFunctionAlias();
	    	alert(ax);
	    }

	// 得到flash对象，通过对IE,FireFox,谷歌的测试，不过我试的这几个浏览器都能找到document[movieName]，不过还是留着剩下的判断，说不定在某些浏览器可以派上用场
	 function getSWFObject(movieName)
	 {
	     if(document[movieName])
	     {
	         return document[movieName];
	     }else if(window[movieName]){
	         return window[movieName]; 
	     }else if(document.embeds && document.embeds[movieName]){
	         return document.embeds[movieName];
	     }else{
	         return document.getElementById(movieName);
	     }
	 }

html中添加div：

?<div id="divChart" ></div>?

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!