Flex在IFrame组件之下JS和as的相互调用

简介: Flex嵌入在页面中时,JS和as的相互调用是比较常用的技巧。在普通嵌入下,JS和as相互调用的资料比较常见import flash.

Flex嵌入在页面中时,JS和as的相互调用是比较常用的技巧。在普通嵌入下,JS和as相互调用的资料比较常见

import  flash.external.ExternalInterface;

引入ExternalInterface即可解决
详见:http://blog.csdn.net/qq1113130712/article/details/41007009


在嵌入IFrame的情况下,对嵌入的页面进行JS互调,和正常嵌入略有不同

嵌入代码

//    嵌入IFrame
<mx:Panel id="NoticePanel" height="141" layout="absolute" right="10" top="15" title="嵌入调用" width="330">
    <ns1:IFrame top="0" left="0" bottom="0" right="0" id="TestCallJs" enabled="true">
    </ns1:IFrame>
</mx:Panel>

Iframe as to js:

Flex:

//  调用
TestCallJs.callIFrameFunction("TestMsgSend", null, JsCallFinish);

 JavaScript: 
 

funtion TestMsgSend() {
    return "as to Js Call"
}

当Js函数执行完毕之后,会触发Flex的JsCallFinish函数,JsCallFinish的参数为JS函数的返回值(本示例为“as  to  Js  Call”)。

IFrame js to as:

       IFrame框架下页面的JS回调Flex页面的as函数,资料比较少。

       通过观察嵌入IFrame后的页面可以看出,嵌入了IFrame之后,并不是真正的嵌入Flex中,而是在页面上覆盖一个div嵌套的Frame框架摆放在IFrame的位置。因此,IFrame嵌套页面下的JS调用Flex的as可以看作是网页Frame框架下的JS对主页面的调用。

       Flex

//   函数定义
public function downloadShareFile(FileName:String):void {
    //Alert.show(FileName);
}
//   挂载调用接口
ExternalInterface.addCallback("downloadFile", downloadShareFile);

       JavaScript

function callas() {
    var ascall = 'test call';
    parent.window.document.getElementById("TestCallJs").downloadFile(ascall);
}


目录
相关文章
|
2月前
|
JavaScript
Vue.js 修饰符:精准控制组件行为
Vue.js 修饰符:精准控制组件行为
|
6月前
|
JavaScript 前端开发 开发者
Vue.js模板语法[下](事件处理,表单综合案例,自定义组件)---详细讲解
Vue.js模板语法[下](事件处理,表单综合案例,自定义组件)---详细讲解
37 0
|
7月前
|
JavaScript
04Vue - Vue.js 入门(用组件构建应用)
04Vue - Vue.js 入门(用组件构建应用)
35 0
|
7月前
|
JavaScript
自定义事件在 Vue.js 组件中的应用
自定义事件在 Vue.js 组件中的应用
30 1
|
10天前
|
JavaScript 前端开发 API
Vue.js 中子组件向父组件传值的方法
Vue.js 中子组件向父组件传值的方法
24 2
|
5月前
|
JavaScript 测试技术
【sgGoogleTranslate】自定义组件:基于Vue.js用谷歌Google Translate翻译插件实现网站多国语言开发
【sgGoogleTranslate】自定义组件:基于Vue.js用谷歌Google Translate翻译插件实现网站多国语言开发
|
5月前
|
JavaScript 索引
用原生js的postMessage实现iframe传值,也可以用于跨域嵌套iframe传值
用原生js的postMessage实现iframe传值,也可以用于跨域嵌套iframe传值
用原生js的postMessage实现iframe传值,也可以用于跨域嵌套iframe传值
|
1月前
|
JavaScript API
Vue.js组件精讲 组件的通信2:派发与广播——自行实现dispatch和broadcast方法
Vue.js 的 provide/inject API 主要用于跨级组件通信,侧重于子组件获取上级状态。但无法良好处理两种场景:父向子(跨级)传递数据和子向父(跨级)传递数据。在这种情况下,虽然Vue推荐使用Vuex,但在某些场景下,可以使用自定义的`dispatch`和`broadcast`方法。这两个方法在Vue 1.x中存在,但在2.x中被废弃。`$emit`用于触发当前组件的自定义事件,而`$on`用于监听这些事件。在Vue 2.x中,我们将自行实现`dispatch`和`broadcast`以实现类似的功能,允许父子组件(包括跨级)之间的通信,特别是当组件层级不深且无需全面状态管理时
15 0
N..
|
2月前
|
JavaScript 前端开发 测试技术
Vue.js的组件
Vue.js的组件
N..
14 1
|
6月前
|
JavaScript 前端开发
Vue.js组件的重要选项
Vue.js组件的重要选项
41 0