有时候Flex需要与外部容器交互，比如和别的项目交互，调用外部数据，则可以通过ExternalInterface来实现。毕竟Flex版本还是比较“年轻”，有些地方还不完美，需要借助外部力量去实现。

 --->点击阅读更多    

       ExternalInterface类是外部 API，这是一个在 ActionScript 和 Flash Player 容器之间实现直接通信的应用程序编程接口，例如，包含 JavaScript 的 HTML 页。Adobe 建议使用 ExternalInterface 实现 JavaScript 与 ActionScript 之间的所有通信。这个类主要有两个方法：


       ●addCallback(functionName:String,closure:Function):void 将ActionScript 方法注册为可从容器调用。成功调用addCallBack() 后，容器中的 JavaScript 或 ActiveX 代码可以调用在 Flash Player 中注册的函数。


        ●call(functionName:String,...arguments):*   调用由 Flash Player 容器公开的函数，不传递参数或传递多个参数。如果该函数不可用，调用将返回null；否则，它返回由该函数提供的值


         具体用法可以查阅Flex4API，里面讲的很详细。


         本人今天做了一个Flex与外部交互的小例子，做了之后对ExternalInterface有了更深的认识。

--->点击阅读更多    


         新建一个mxml页面ExternalInterfaceDemo.mxml，代码如下所示：


[html] view plain copy print ?
  1. <?xml version="1.0"encoding="utf-8"?>  
  2. <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"  
  3.               xmlns:s="library://ns.adobe.com/flex/spark"  
  4.               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="app_creationCompleteHandler(event)">  
  5.     <fx:Script>  
  6.        <![CDATA[ 
  7.            import mx.controls.Alert; 
  8.            import mx.events.FlexEvent; 
  9.            
  10.            protected function app_creationCompleteHandler(event:FlexEvent):void 
  11.            { 
  12.               // TODOAuto-generated method stub 
  13.               ExternalInterface.addCallback("sendData",sendDataSelectHandler); 
  14.               getData.addEventListener(MouseEvent.CLICK,mouseClickHandler); 
  15.            } 
  16.            private function mouseClickHandler(event:MouseEvent):void{ 
  17.               ExternalInterface.call("getData"); 
  18.            } 
  19.            private function sendDataSelectHandler(obj:Object):void{ 
  20.               var name:String=obj['username']; 
  21.               var pass:String=obj['passworld']; 
  22.               username.text=name; 
  23.               passworld.text=pass; 
  24.            } 
  25.        ]]>  
  26.     </fx:Script>  
  27.     <fx:Declarations>  
  28.        <!-- Place non-visualelements (e.g., services, value objects) here -->  
  29.     </fx:Declarations>  
  30.     <s:Panel x="205" y="116" width="574" height="324">  
  31.     <s:Button id="getData" x="261" y="196" width="134" height="42" fontSize="16" label="获取外部数据"/>  
  32.     <s:Label x="179" y="92" width="71" fontSize="19" text="姓名："/>  
  33.     <s:TextInput x="254" y="92" id="username" fontSize="16" editable="false"/>  
  34.     <s:Label x="179" y="145" fontSize="18" text="密码："/>  
  35.     <s:TextInput x="256" y="137" id="passworld" fontSize="16" editable="false"/>  
  36.     </s:Panel>  
  37. </s:Application>  
  38.    


       运行后页面如下所示：




      接着需要新建一个JavaScript文件用于Flex与Jsp通信的桥梁。可是如果我们直接将JavaScript代码写在自动生成的ExternalInterfaceDemo.Html中的话，当我们再次修改ExternalInterfaceDemo.mxml文件后自动生成的ExternalInterfaceDemo.Html将覆盖原有的代码，这样我们的努力都会功亏与溃，那么怎么办？


        查资料我才发现，每个自动生成的html页面都是由html-template目录下的index.template.html模板页生成，如果我们在此页面中添加一个JavaScript引入文件，那么所有的页面都会自动引入此JavaScript文件。问题就此解决了。


        新建一个用于向Flex传送数据的Jsp文件externalInterfaceJsp.jsp，代码如下所示：



[html] view plain copy print ?
  1. <%@ page language="java"contentType="text/html; charset=utf-8"  
  2.     pageEncoding="utf-8"%>  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTDHTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  4. <html>  
  5. <head>  
  6. <meta http-equiv="Content-Type"content="text/html; charset=ISO-8859-1">  
  7. <title>测试</title>  
  8. <script type="text/javascript"src="../page/swf/commonJS.js"></script>  //引用创建的JavaScript文件  
  9. <style type="text/css">   
  10.        table.demo{border-collapse: collapse;margin-left:50px;margin-top:10px;}   
  11.        table.demo th,td {padding: 0; border: 1px solid #000;}   
  12.     </style>   
  13. </head>  
  14. <body>  
  15.     <form >  
  16.        <table  class="demo"  width="400px"height="150px"  id="registerTable">   
  17.            <thead>   
  18.               <tr style="height:10px;" >   
  19.                   <th colspan="2" align="center">注册表</th>   
  20.               </tr>   
  21.            </thead>   
  22.            <tbody>      
  23.               <tr>   
  24.                   <td style="text-align: right;">姓名：</td>   
  25.                   <td><input id="username"type="text">  </td>      
  26.               </tr>   
  27.               <tr>   
  28.                   <td style="text-align: right;">密码：</td>   
  29.                   <td><input id="passworld"type="password" ></td>   
  30.               </tr>   
  31.               <tr >   
  32.                   <th colspan="2" align="center"> <input type="button" value="提交" onClick="submitData()"></th>   
  33.               </tr>   
  34.           </tbody>  
  35.           </table>     
  36.     </form>  
  37. </body>  
  38. </html>  


     运行效果如下所示：




       接下来新建一个JavaScript文件commonJS.js，我是在输出目录下新建的一个JavaScript文件：



[javascript] view plain copy print ?
  1. /** 
  2.  * Flex与Jsp交互 
  3.  */  
  4. function getData()  
  5. {  
  6.     var url="../../jsp/externalInterfaceJsp.jsp";  
  7.     window.open(url,"", "height=200,width=500,status=no,resizable=yes,location=no,left=95,top=110,scroll=no,help=no"); //打开一个新窗口  
  8. }  
  9. function submitData(){  
  10.     try{  
  11.     var username=document.getElementById("username").value;  
  12.     var passworld=document.getElementById("passworld").value;  
  13.     var obj=new Object();  
  14.     obj.username=username;  
  15.     obj.passworld=passworld;  
  16.     var ExternalInterfaceDemo=window.parent.opener.document.getElementById('ExternalInterfaceDemo');  //获得一个ExternalInterfaceDemo实例  
  17.     ExternalInterfaceDemo.sendData(obj);  //调用ActionScript中的方法  
  18.     window.close(); //关闭此子窗口  
  19.     }catch(e){  
  20.        alert(e);  
  21.     }  
  22. }  


       好了，开始交互，当我们在externalInterfaceJsp.jsp中输入数值后，此页面的数据就会自动带回到Flex页面。如果你实现了就说明你成功了。

--->点击阅读更多    

# javascript # actionscript
Logo
向您推荐>>Eolink开发者社区

权威｜前沿｜技术｜干货｜国内首个API全生命周期开发者社区

更多推荐

ELK实现containerd的容器日志采集展示【基于logging的全栈监测】

企业级ELK Stack构建介绍

avatar 云原生

深入理解 Mocha 测试框架：从零实现一个 Mocha

前言什么是自动化测试自动化测试在很多团队中都是Devops环节中很难执行起来的一个环节，主要原因在于测试代码的编写工作很难抽象，99%的场景都需要和业务强绑定，而且写测试代码的编写工作量往往比编写实际业务代码的工作量更多。在一些很多业务场景中投入产出比很低，适合写自动化测试的应该是那些中长期业务以及一些诸如组件一样的基础库。自动化测试是个比较大的概念，其中分类也比较多，比如单元测试，端对端测试，集

avatar 云原生

(20200916 Solved)docker-compose up创建容器自动退出

问题描述如题，创建容器后自动退出了。并且docker start container无效解决方案原因是缺失了控制终端的配置，需要在docker-compose.yml中增加tty:true ，有时候这样也不行，需要再增加一个command:/bin/bash，命令不一定是这个，需要是一个不会退出的命令，然后用-d后台启动容器。Referencesdocker-compose启动容器后自动退出...

avatar 云原生