Flex组件IFrame中嵌入HTML页面的方法
2009-07-17 10:41
465 查看
Flex组件IFrame中嵌入HTML页面的方法
2008年05月08日 星期四 13:12
2008年05月08日 星期四 13:12
功能描述:在Flex中嵌套框架,并且进行数值传递 1、编辑Flex框架组件iFrame.mxml <?xml version="1.0" encoding="utf-8"?> <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" resize="callLater(moveIFrame)" move="callLater(moveIFrame)"> <mx:Script> <![CDATA[ import flash.external.ExternalInterface; import flash.geom.Point; import flash.net.navigateToURL; private var __source: String; /** * Move iframe through ExternalInterface. The location is determined using localToGlobal() * on a Point in the Canvas. **/ private function moveIFrame(): void { var localPt:Point = new Point(0, 0); var globalPt:Point = this.localToGlobal(localPt); ExternalInterface.call("moveIFrame", globalPt.x, globalPt.y, this.width, this.height); } /** * The source URL for the IFrame. When set, the URL is loaded through ExternalInterface. **/ public function set source(source: String): void { if (source) { if (! ExternalInterface.available) { throw new Error("ExternalInterface is not available in this container. Internet Explorer ActiveX, Firefox, Mozilla 1.7.5 and greater, or other browsers that support NPRuntime are required."); } __source = source; ExternalInterface.call("loadIFrame", source); moveIFrame(); } } public function get source(): String { return __source; } /** * Whether the IFrame is visible. **/ override public function set visible(visible: Boolean): void { super.visible=visible; if (visible) { ExternalInterface.call("showIFrame"); } else { ExternalInterface.call("hideIFrame"); } } ]]> </mx:Script> </mx:Canvas> 2、放置到要使用框架的Flex中index.mxml,并写入引用哪个frame.html <ui:IFrame id="iFrame" source="frame.html" visible="true" width="100%" height="300"/> 3、在引用框架的Flex生成页index.html里加入: <1. wmode set to opaque 在调用swf的后面加上"wmode","opaque" 例如:"pluginspage", "http://www.adobe.com/go/getflashplayer", "wmode","opaque" <2. the moveIFrame,hideIFrame,showIFrame,loadIFrame methods <script language="JavaScript" type="text/javascript"> <!-- // ----------------------------------------------------------------------------- // Globals // Major version of Flash required var requiredMajorVersion = 9; // Minor version of Flash required var requiredMinorVersion = 0; // Minor version of Flash required var requiredRevision = 28; // ----------------------------------------------------------------------------- // --> function moveIFrame(x,y,w,h) { var frameRef=document.getElementById("myFrame"); frameRef.style.left=x; frameRef.style.top=y; var iFrameRef=document.getElementById("myIFrame"); iFrameRef.width=w; iFrameRef.height=h; } function hideIFrame(){ document.getElementById("myFrame").style.visibility="hidden"; } function showIFrame(){ document.getElementById("myFrame").style.visibility="visible"; } function loadIFrame(url){ document.getElementById("myFrame").innerHTML = "<iframe id='myIFrame' src='" + url + "'frameborder='0'></iframe>"; } //要调用的内容,加载前三个就可以了,后面这个函数是用来调用返回值 function getEditorText(){ return document.getElementById("myIFrame").contentWindow.GetEditorText1(); } </script> <3. the 'myFrame' div 在</body>这前写入: <div id="myFrame" style="position:absolute;background-color:transparent;border:0 px;visibility:hidden;"></div> 4、在Flex页面index.mxml输入的函数值,调用index.html中的'getEditorText'函数,并且写入到text1.text中 text1.text=ExternalInterface.call('getEditorText',param1,param2,param3,...) getEditorText:函数名称 param:参数值 5、在生成页中取得框架中的函数 框架内的frame.html,放置在head之间: function GetEditorText1(){ return getHTML(params); index.html生成页的调用,设置在head之间: function getEditorText(){ return document.getElementById("myIFrame").contentWindow.GetEditorText1(); } 后记:实际中在这里只是调用一个层放在对应位置而已,当我们在Flex中做申缩动作时,层也要跟着改变,我是如此处理的: 设置move或show事件,当move或show时则调用:iFrame.source = "frame.html" 参考: http://www.cnflex.cn/html/mxml/20070321/95.html http://www.cnblogs.com/dannyr/archive/2004/11/24/68026.aspx http://renaun.com/flex2/posts/flexsearch/index.html(有源码下载) |
相关文章推荐
- [Flex] IFrame系列 —— IFrame嵌入html点击其他组件后页面消失的问题
- [Flex] IFrame系列 —— 在flex的web应用中嵌入html的方法
- 在Flex (Flash)中嵌入HTML 代码或页面—Flex IFrame
- [Flex] IFrame系列 —— 嵌入本地页面两种方式source和content(html页面和html代码)
- flex通过iframe嵌入完整html页面
- html iframe 子页面调用父页面的方法
- flex 3通过iframe嵌入完整html网页的简单办法
- 用Request方法从页面得到Html内容时的处理 及 iframe中控件内容的获取
- Flex-iframe在SWF中嵌入网页的组件(推荐)
- safari,opera嵌入iframe页面cookie读取问题解决方法
- 在Flex (Flash)中嵌入HTML 代码或页面—Flex IFrame
- 在Flex(Flash)中嵌入HTML代码或页面(Flex IFrame)
- html中iframe调用父页面方法和变量
- 在Flex中嵌入完整HTML页面
- Flex2 发现之旅:在Flex中嵌入完整HTML页面
- flex嵌入html完整页面and嵌入其他项目swf文件
- 在Flex中用Iframe嵌入HTML网页
- HTML中嵌入Javasript的方法及在页面的执行顺序
- 在Flex中嵌入完整HTML页面
- html页面中iframe嵌套页面的父页面和子页面js方法互相调用