开发工具 ：flexBuilder3
js 文件位置： flex_src/js/hello.js
Flex2js.mxml
<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2008/03/09/calling-javascript-functions-from-your-flex-applications-using-the-externalinterface-api/ --> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white" creationComplete="initApp()" > <mx:Script> <!--[CDATA[ private function initApp():void{ //添加一个函数，callFlex 供js调用，实际调用的是Flex中的jsCallFlex 函数 ExternalInterface.addCallback("callFlex",jsCallFlex); } private function callJavaScript():void { //Flex调用js函数sayHelloWorld ，并且传递参数params ExternalInterface.call("sayHelloWorld","params"); } //真正的供js调用的Flex里的函数 public function jsCallFlex():void{ button.label="js call flex successful!"; } ]]--> </mx:Script> <mx:Button id="button" label="Say 'Hello World'" click="callJavaScript();" /> </mx:Application>
修改工程目录下 html-template/index.template.html 文件
在<head></head> 中添加
<!-- add by hpf -->
<script src="js/hello.js" language="javascript"></script>
在<body></body>中添加
调用flex的按钮：
<button οnclick="callFlex()">Call App</button>
最后的ndex.template.html 页面模板文件如下：
<!-- saved from url=(0014)about:internet --> <html lang="en"> <!-- Smart developers always View Source. This application was built using Adobe Flex, an open source framework for building rich Internet applications that get delivered via the Flash Player or to desktops via Adobe AIR. Learn more about Flex at http://flex.org // --> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <!-- BEGIN Browser History required section --> <link rel="stylesheet" type="text/css" href="history/history.css" mce_href="history/history.css" /> <!-- END Browser History required section --> <title>${title}</title> <mce:script src="AC_OETags.js" mce_src="AC_OETags.js" language="javascript"></mce:script> <!-- add by hpf --> <mce:script src="js/hello.js" mce_src="js/hello.js" language="javascript"></mce:script> <!-- BEGIN Browser History required section --> <mce:script src="history/history.js" mce_src="history/history.js" language="javascript"></mce:script> <!-- END Browser History required section --> <mce:style><!-- body { margin: 0px; overflow:hidden } --></mce:style><style mce_bogus="1">body { margin: 0px; overflow:hidden }</style> <mce:script language="JavaScript" type="text/javascript"><!-- // ----------------------------------------------------------------------------- // Globals // Major version of Flash required var requiredMajorVersion = ${version_major}; // Minor version of Flash required var requiredMinorVersion = ${version_minor}; // Minor version of Flash required var requiredRevision = ${version_revision}; // ----------------------------------------------------------------------------- // --></mce:script> </head> <body scroll="no"> 调用flex的按钮 <button οnclick="callFlex()">Call App</button> <mce:script language="JavaScript" type="text/javascript"><!-- // Version check for the Flash Player that has the ability to start Player Product Install (6.0r65) var hasProductInstall = DetectFlashVer(6, 0, 65); // Version check based upon the values defined in globals var hasRequestedVersion = DetectFlashVer(requiredMajorVersion, requiredMinorVersion, requiredRevision); if ( hasProductInstall && !hasRequestedVersion ) { // DO NOT MODIFY THE FOLLOWING FOUR LINES // Location visited after installation is complete if installation is required var MMPlayerType = (isIE == true) ? "ActiveX" : "PlugIn"; var MMredirectURL = window.location; document.title = document.title.slice(0, 47) + " - Flash Player Installation"; var MMdoctitle = document.title; AC_FL_RunContent( "src", "playerProductInstall", "FlashVars", "MMredirectURL="+MMredirectURL+'&MMplayerType='+MMPlayerType+'&MMdoctitle='+MMdoctitle+"", "width", "${width}", "height", "${height}", "align", "middle", "id", "${application}", "quality", "high", "bgcolor", "${bgcolor}", "name", "${application}", "allowScriptAccess","sameDomain", "type", "application/x-shockwave-flash", "pluginspage", "http://www.adobe.com/go/getflashplayer" ); } else if (hasRequestedVersion) { // if we've detected an acceptable version // embed the Flash Content SWF when all tests are passed AC_FL_RunContent( "src", "${swf}", "width", "${width}", "height", "${height}", "align", "middle", "id", "${application}", "quality", "high", "bgcolor", "${bgcolor}", "name", "${application}", "allowScriptAccess","sameDomain", "type", "application/x-shockwave-flash", "pluginspage", "http://www.adobe.com/go/getflashplayer" ); } else { // flash is too old or we can't detect the plugin var alternateContent = 'Alternate HTML content should be placed here. ' + 'This content requires the Adobe Flash Player. ' + '<a href="http://www.adobe.com/go/getflash" mce_href="http://www.adobe.com/go/getflash"></a>Get Flash</a>'; document.write(alternateContent); // insert non-flash content } // --></mce:script> <noscript> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id="${application}" width="${width}" height="${height}" codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab"> <param name="movie" value="${swf}.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="${bgcolor}" /> <param name="allowScriptAccess" value="sameDomain" /> <embed src="${swf}.swf" mce_src="${swf}.swf" quality="high" bgcolor="${bgcolor}" width="${width}" height="${height}" name="${application}" align="middle" play="true" loop="false" quality="high" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer"> </embed> </object> </noscript> </body> </html>
hello.js 文件中的内容如下：（js 文件位置： flex_src/js/hello.js）
function sayHelloWorld(str) { alert("flex call js success,params:"+str); } function callFlex() { var x = Flex2js.callFlex(); alert("call flex success!~"); }
over~~~
需要注意的是，我这个是web项目，部署到tomcat下执行一切正常
如果是纯Flex项目，可能用 alt+shift+x F 执行有问题
在MyEclipse里直接访问页面 bin-debug下面的 html页面则没有问题~
3094
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
