flex与js通信与彼此之间的互调整理(一)

由于这个迭代上面下发的任务中有一条：需要使用flex调用js来操控用ajax做的三维球，任务落在了我的身上，我也就才开始学习flex，以前用flash做过游戏，所以很快过了一遍语法就行了，开始网上查找flex和js之间互相调用的范例，这里整理一下也避免忘记，也和大家互相交流交流。

我用的是flash builder 4.6，也不熟悉。

一、flex调用js。

新建flex项目FlexToJs，如图所示：

Felx调用js其实就是使用的方法ExternalInterface.call()。主界面添加一个按钮，并且注册一个点击事件，如图：

SayHellWorld是字符串，对应我们调用的js文件里面的方法，名字一样，params是所传的参数字符串。

接下来我们使用WebStorm创建一个HellWorld.js文件（代码简单，用文本编辑器也可以快速创建），代码如下：

将此js文件放在FlexToJs/html-template下，这是运行时代码的存放地址，如果需要调试，那么需要在FlexToJs/bin-debug下面也放一份，如图：

在index.template.html里面加上一句<script type="text/javascript" src="HelloWorld.js"></script>，就是加一个js的引用，这个都会，不用截图了吧！在FlexToJs.html里面同样地方在你保存的时候会自动加上这句话，有兴趣的可以研究他们的关系。接下来运行FlexToJs.mxml，在点击按钮的时候会通过我们添加引用的界面去调用js文件里面的方法sayHelloWorld，最后弹出警告，如图：

我这个电脑不知咋的，IE下可以，chrome下就是不行，按钮都出不来。

下面，我们来优化代码，上面如果不需要传递参数，你在js文件里面就不使用，但是flex的那个参数还是要写上，不然有些时候会出错误。

如果我们需要返回值呢？需要传递非字符串的参数呢？

下面我们就一起来改一改吧！

把FlexToJs.mxml内部改为如下：

按钮需要添加一个id，主要是为了方面使用，很容易明白我使用了数组传递给js，并且返回一个新的数组来改变按钮的显示。而之前的HelloWorld.js变为：

也很容易明白，就改变了一下数组里面的内容。最后结果为：“Hello yy!Hello xx!Hello zz!”

，返回值和传参都完成了，基本可以满足大家的需求了，不过这些参数只能满足常用的String、int等，如果是自己写的类想传递，那么你在两边都得写解析的函数了，这里就不做详细介绍了，大家可以自己尝试。

二、js调用flex。

有人可能会提出当我们调用了js文件，二如果js里面需要在某时候调用flex里面的方法如何办呢？下面我们就来解决这个问题。

继续使用刚才的项目，直接在上面做修改。将FlexToJs.mxml改为如下：

去掉了按钮，不需要了，注意在Application最后添加了一个事件，在初始化完成后调用initApp，这里的sayCallBack对应js里面的方法，在这里监听，当在js里面触发调用此方法时会转化给callBack来处理，最后返回值给js里面的init。Js文件如下：

这里dou.sayCallBack调用的就是flex里面的那个字符串方法。

最后在文件index.template.html里面需要添加一个按钮，如图：

这个按钮调用js里面的init方法。运行后的效果：

参数和返回值都有了，应该满足大家的需求了吧！后续如果有时间再把flex调用js控制出二维地图和三维球的过程写写，不过这些都需要使用超图的一些第三方控件了！希望对大家有所帮助。

赞 (0)

相关推荐

  • flex与js通信与彼此之间的互调整理(二)

    flex与js通信与彼此之间的互调整理(二)

    之前写了一篇flex和js之间的通信,还记得最开始研究这两门语言如何交互,一晃我的任务也快做完了,公司的realspace产品之开了js的API,但是现在使用flex产品的人也比较多,要求开设flex的三维API,已经过去几个月了,产品也上线了,有兴趣的可以在https://github.com/SuperMap/Flex-Realspace下载,这是一个利用as与js交互放在了一个完整的产品里. 网上也有很多关于flex和js通信的文章,不过不知道大家有没有注意到好像都需要把js文件放在固定的

  • flex与js通信与彼此之间的互调整理(一)

    flex与js通信与彼此之间的互调整理(一)

    由于这个迭代上面下发的任务中有一条:需要使用flex调用js来操控用ajax做的三维球,任务落在了我的身上,我也就才开始学习flex,以前用flash做过游戏,所以很快过了一遍语法就行了,开始网上查找flex和js之间互相调用的范例,这里整理一下也避免忘记,也和大家互相交流交流. 我用的是flash builder 4.6,也不熟悉. 一.flex调用js. 新建flex项目FlexToJs,如图所示: Felx调用js其实就是使用的方法ExternalInterface.call().主界面添

  • 嵌入式iframe子页面与父页面js通信的方法

    本文实例讲述了嵌入式iframe子页面与父页面js通信的方法.分享给大家供大家参考.具体分析如下: iframe框架中的页面与主页面之间的通信方式根据iframe中src属性是同域链接还是跨域链接,有明显不同的通信方式,同域下的数据交换和DOM元素互访就简单的多了,而跨域的则需要一些巧妙的方式来实现通信. 一.同域下父子页面的通信 父页面 parent.html: 复制代码 代码如下: <html> <head> <script type="text/javascr

  • JS中的数组方法笔记整理

    push()方法:可以向数组的末尾添加一个或者多个元素,并且返回新的长度 pop()方法:可以删除数组最后一个元素,并且返回被删除的元素,注意:如果数组是空的,该方法不进行任何操作,返回undefined. unshift()方法:可以向数组的开头添加一个或者多个元素,并且返回新的长度 shift()方法:可以删除数组第一个元素,并且返回被删除的元素,注意:如果数组是空的,该方法不进行任何操作,返回undefined. splice()方法:从数组中添加/删除项目,然后返回被删除的项目,该方法会

  • js调用Flex中的方法并向flex中传参及flex调用js示例

    首先,有了一个swf文件,test.swf,同时也有一个自动生成的html文件,test.html. 然后,在另外一个文件,test.jsp中,通过iframe,引入了test.html,即引入了swf. 现在想要在test.jsp中,向flex传参,并调用flex中的方法,我采用的方法是: 首先,在jsp中写一个调用flex的方法,如下 复制代码 代码如下: function initSWF(){ //得到swf的object var obj = window.frames["rightfra

  • flex通过js获取ip和pcname示例代码

    flex通过js获取ip和pcname示例代码

    这个是在js中获取ip和pcname的方法,现在将它放在flex启动模板中即可.看代码: 复制代码 代码如下: function getClientPcName() { //"请将您浏览器Internet选项中的"对没有标记为安全的ActiveX控件进行初始化和脚本运行"设置为"启用"!\n\n然后刷新本页登陆!" var WshShellPcName = new ActiveXObject("WScript.Network"

  • Flex通过JS获取客户端IP和计算机名的实例代码

    首先说明一下,用JS方式获取不是调用webservices和httpservices. 在我们每一个FLex web工程中,都有那么一个文件夹bin-debug,里面有个index.html文件,我的个人理解是这样的,首先网页运行的时候,mxml的文件会被编译为swf,那么swf如何在浏览器中展现,就是通过这个html文件,相当于在html文件中嵌入了一个swf的object组件. www.jb51.net 所以,在这个html中写入js的代码,来获取ip地址我个人觉得是可行的.因此出现以下代码

  • iframe子页面与父页面在同域或不同域下的js通信

    iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html 复制代码 代码如下: <html> <head> <script type="text/javascript"> function say(){ alert("parent.html"); } function callChild(){ myFrame.window.say()

  • JavaScript的Backbone.js框架的一些使用建议整理

    Backbone 为复杂Javascript应用程序提供模型(models).集合(collections).视图(views)的结构.其中模型用于绑定键值数据和自定义事件:集合附有可枚举函数的丰富API: 视图可以声明事件处理函数,并通过RESTful JSON接口连接到应用程序. 当我们开发含有大量Javascript的web应用程序时,首先你需要做的事情之一便是停止向DOM对象附加数据. 通过复杂多变的jQuery选择符和回调函数创建Javascript应用程序,包括在HTML UI,Ja

  • js页面跳转的常用方法整理

    复制代码 代码如下: <!--脚本开始--> <script language="javascript" type=""> function countDown(secs){ tiao.innerText=secs; if(--secs>0) setTimeout("countDown("+secs+")",1000); } countDown(3); </script> <!-

随机推荐