- 浏览: 547736 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (740)
- css (4)
- jquery (8)
- javascript (23)
- html (0)
- uml (0)
- 设计模式 (1)
- 开发工具 (14)
- json (4)
- struts 1.x (3)
- spring (3)
- hibernate (6)
- struts 2.x (17)
- JFreechart (0)
- j2se (48)
- jsp (9)
- flex (22)
- 找工作 (1)
- 技术杂谈 (18)
- 网络编程 (5)
- io流 (1)
- ORACLE (15)
- 报表 (3)
- extjs (11)
- jpbm (2)
- swing (5)
- jspereports (3)
- sql (1)
- linux (15)
- ps (1)
- storm (4)
- hbase (8)
- li (0)
- python (1)
- hive (3)
- 机器学习 (1)
- hdfs (1)
- elasticsearch (1)
- hadoop 2.2 (5)
- hadoop (1)
最新评论
-
Tristan_S:
这个有点意思
ASM -
starryskydog:
程序修改detail band部分的样式 如内容字体大小 ...
使用jasperReport实现动态表头 -
samwong:
Good, so usefule
使用YUI Compressor压缩CSS/JS -
gc715409742:
能够告诉我怎么在web项目中使用YUI Compressor? ...
使用YUI Compressor压缩CSS/JS -
JsonTeye:
您好! 我看你的代码,我现在也在做动态报表,实现功能由用户自己 ...
使用jasperreport动态生成pdf,excel,html
Flex与JS交互推荐用ExternalInterface,它可以让JS和AS互相调用其中函数,传递所有可接受的参数甚至是一些复杂的对象。Flex编译生成的文件是swf,其本质还是Flash,所以Flash能使用的通信方式,完全适用于Flex。几年前大家经常用fscommand与Flash的外部容器交互,此方法早已不适用。
在网页中嵌入swf很简单,但要保证其最好的交互性、数据的正确性是比较花费精力的,推荐使用SWFObject来嵌入FLASH。看过例子中你就会发现这些方式已经完全够用,所以才叫“完全手册”,本文用最简洁的语言描述,重点介绍数据传输。
先看演示:
最简办法——URL变量
http://flexbaba.com/swf/TestLoaderinfo.swf?id=123&name=lukia&site=flexbaba.com
这样写的好处是明显、直观,但数据量大了,可能会有问题,IE的最大URL长度限制是2083字节,而实际可以使用的最大长度为2048字节。所以有些问题可以交给JS处理。
一、flex中调用js函数
1、传递的参数赋值
var tmpObj:Object = new Object();
tmpObj.tmpParam = "flex赋值";
2、直接调用js中的函数
ExternalInterface.call("callByFlex",tmpObj);//FLEX中调用 JS中的函数
二、js调用flex中的函数
1、flex中的供js调用函数的注册
ExternalInterface.addCallback("flexfun",jsCallFun);//注册被JS调用的FLEX函数,flexfun为js调用的函数名,jsCallFun为flex实际对应的函数名
2、JS调用代码
var swf = findSWF("swfId");
//传递参数赋值
var tmpObj = {};
tmpObj.inName="name";
tmpObj.inPhone="phone";
swf.flexfun(tmpObj);
function findSWF(movieName) {
if (navigator.appName.indexOf("Microsoft")!= -1) {
return window[movieName];
} else {
return document[movieName];
}
}
flex代码(flex4):
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"
creationComplete="init()"
applicationComplete="showParams()">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.core.FlexGlobals;
import mx.rpc.xml.SimpleXMLDecoder;
[Bindable]
private var flashvars:String = "";//保存所有传入变量的名称及变量值
[Bindable]
private var jsObjvars:String = "";//保存JS中对象中的名称及变量值
private function init():void{
ExternalInterface.addCallback("paserXML",paserXML);
//ExternalInterface.call("swfLoadedHandler");
}
private function showParams():void{
//var info:Object = Application.application.loaderInfo.parameters;
var info:Object = FlexGlobals.topLevelApplication.loaderInfo.parameters;
flashvars = "";
for(var varName:String in info){
flashvars += "name:"+varName+"\t\t value: "+info[varName]+"\n";
}
}
private function paserXML(xmlstr:String):Object{
Alert.show(xmlstr);
//新建一个XML解析器
var xmlDecoder:SimpleXMLDecoder = new SimpleXMLDecoder();
//解析器的decodeXML方法可以将XMLDocument转化为Object
var obj:Object = xmlDecoder.decodeXML(new XMLDocument(xmlstr));
return obj;
}
private function showJSObject():void{
var obj:Object = ExternalInterface.call("getJSObject");//调用JS中函数
jsObjvars = "";
for(var varName:String in obj){
jsObjvars += "name:"+varName+"\t\t value: "+obj[varName]+"\n";
}
}
]]>
</mx:Script>
<mx:Button click="showParams()" label="Show Variables"/>
<mx:TextArea text="{flashvars}" width="500" height="150"/>
<mx:Button click="showJSObject()" label="Show JS Object"/>
<mx:TextArea text="{jsObjvars}" width="500" height="150"/>
</mx:Application>
js代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<script type="text/javascript" src="swfobject.js"></script>
<script language="JavaScript" type="text/javascript">
/*
//如果只有一个参数,就用这个。
function getParameter(){
var url=window.location .href;
var aa=url.indexOf('=');
if (aa == -1)
return "";
url=url.substring(aa+1);
alert(url.substring(aa+1));
}
*/
// 如果有多个参数,就用这个函数。param 为 参数的名称
function getParameter(param){
var query = window.location.search;
alert("query:"+query);
var iLen = param.length;
var iStart = query.indexOf(param);
if (iStart == -1)
return "";
iStart += iLen + 1;
var iEnd = query.indexOf("&", iStart);
if (iEnd == -1)
return query.substring(iStart);
return query.substring(iStart, iEnd);
}
function getJSObject(){//构造一个复杂对象传给Flex
var obj = new Object();
obj.oid = 12;
obj.arr = ["a","b","c"];
obj.name = "an Object";
return obj;
}
function thisSWF(swfID){//这个函数
if (navigator.appName.indexOf("Microsoft") != -1) {
return window[swfID];
} else {
return document[swfID];
}
}
function swfLoadedHandler(){//JS处理XML的能力不强,我想把它转换成Object。可以靠Flex来实现
var xmlStr="<sites><site name='adobe.com' id='0'/><site name='flexbaba.com' id='2'/><site name='sf.net' id='3'/></sites>";
var obj = thisSWF("mySWF").paserXML(xmlStr);
debugger
alert("in js swfLoadedHandler");
}
alert(getParameter("id"));
//alert(getParameter("id")+getParameter("name"));//这样可以取到某个特定的变量值
//swfobject.embedSWF("TestLoaderinfo.swf“, "mySWF", "100%", "100%", "9.0.0");//不加参数只加载SWF
//swfobject.embedSWF("TestLoaderinfo.swf?id="+getParameter("id")+"", "mySWF", "100%", "100%", "9.0.0");//取得某些参数
swfobject.embedSWF("TestLoaderinfo.swf?"+"id=12&name=xxx", "mySWF", "100%", "50%", "9.0.0");
</script>
<style type="text/css" media="screen">
html,body,#mySWF {
height: 100%;
}
body {
margin: 0;
padding: 0;
overflow: hidden;
}
</style>
</head>
<body style="margin: 0px; padding: 0px;">
<button onclick="swfLoadedHandler()">调用flex方法</button>
<div id="mySWF">
<h1>
您需要更新Flash Player
</h1>
<p>
<a href="http://www.adobe.com/go/getflashplayer">取得新版Flash
Player</a>
</p>
</div>
</body>
</html>
发表评论
-
(原创)flex(AIR)远程文件下载实例(高级版)
2012-01-12 23:36 1128<?xml version="1.0 ... -
关于Flex安全沙箱问题的解决
2012-01-12 11:10 1013关于Flex安全沙箱问题的解决 前些天做了一个 ... -
flex as自定义组件
2012-01-10 10:20 1195Flex 3入门教程: 在Act ... -
flex上传和下载文件
2012-01-09 15:45 1134FileIO 示例说明了在 Flash Player 中执 ... -
[心得教程] Flex与 JS 交互通信方法
2012-01-08 16:07 1386心得教程类型: navigateToURL( ... -
Flex中的文件上传与下载
2012-01-08 14:01 1299和传统的JSP一样,在 ... -
FileReference+HttpHandler实现文件上传/下载
2012-01-08 13:25 1238在Flex的应用开发中,同ASP.NET,JSP ... -
Flex保存文件 FileReference.save(data,filename)
2012-01-08 13:14 2467一、save() 方法简介save()这个方 ... -
关于flex 4的新数据类型中英文对照
2010-08-31 08:34 965Flex 4 new data type:ArrayList ... -
Flex程序与html通信方法大全
2010-08-29 09:30 1073Flex通常作为一个web项目的一部分嵌入到一个web页中,因 ... -
flex图文混排
2010-08-29 09:29 2813由于我们项目需要在flex中实现图文混排的效果,在实现的过程中 ... -
mx:Module mx:XML mx:XMLList mx:XMLListCollection mx:Array mx:ArrayCollection比较
2010-08-23 08:38 984mx:Module 是模块化,好处是,预先不加载,用的时候才加 ... -
flex学习资料
2010-08-19 15:45 1023flex动态效果演示: http://www.efflex.o ... -
使用BlazeDS Java的数据对应表
2010-08-19 12:15 924使用BlazeDS Java的数据对应表 从Action ... -
通道端点配置1
2010-08-19 12:14 997通道端点配置 选择端点 BlazeDS提供了下列 ... -
blazeds学习笔记一整体认识
2010-08-19 12:13 1505blazeds学习笔记一整体认识 BlazeDS是一组服 ... -
后台主动推数据
2010-08-19 12:08 1219后台主动推数据 view sourceprint?1 Asyn ... -
Producer Consumer实例
2010-08-19 11:47 1301Producer Consumer实例 在上一篇文章(blaz ... -
Producer Consumer讲解
2010-08-19 11:46 1272blazeds学习笔记四Producer Consumer讲解 ... -
blazeds学习笔记
2010-08-19 11:39 1083blazeds学习笔记三Message?s ...
相关推荐
也可以使用Flex的`ExternalInterface`类来调用JavaScript,再由JavaScript与Flash进行通信。 4. **最佳实践** - **代码分离**:尽量将业务逻辑和视图分离,将复杂的交互逻辑写在Flex中,而将视觉表现和动画交给...
标题"flex和javascript交互例子"指向了这个主题的核心——如何在Flex应用中调用JavaScript函数,以及反过来在JavaScript中调用Flex的方法。这种技术通常被称为“Bridge”或“跨域通信”。 在Flex中,我们可以使用`...
精通Flex网络开发技术》是一本专注于教授如何使用Adobe Flex进行网络应用开发的书籍,特别强调了与ActionScript、JavaScript以及AJAX的整合。这本书的目标读者是初学者,旨在帮助他们快速掌握Flex的基本概念和技术,...
与浏览器的通信能够让 你建立一个可以超越Flex 应用本身的应用程序。你可以连接到已有的地址,通过JavaScript 和其他应用程序通信,并且可以和浏览器的历史记录交互,作为开始。ExternalInterface 类 让你能够调用...
### ArcGIS RIA开发实践【背景篇】【Flex篇】 #### RIA简介及其优势 ##### RIA定义 RIA(Rich Internet Application,富互联网应用)是一种基于Web的应用程序模型,旨在为用户提供更加丰富的用户体验和更强的交互...
5. **服务调用**:Flex可以轻松地与后端服务器进行通信,如通过HTTPService或WebService调用远程API,获取或提交数据。 6. **事件驱动编程**:Flex应用是事件驱动的,用户操作或其他系统事件会触发相应的事件处理器...
【标题】"Flex初体验"揭示了我们即将探讨的主题——Adobe Flex,这是一款用于构建富互联网应用程序(RIA)的开源框架。Flex以其强大的MXML和ActionScript编程语言为开发者提供了丰富的用户界面创建能力,尤其在Web...
- **网络通信与服务端交互**:讲解Flex应用程序如何通过HTTP请求与服务器进行通信,包括JSON和XML数据格式的处理。 #### 第三部分:实用案例 - **多媒体应用开发**:教授如何在Flex项目中集成音频和视频元素,包括...
使用BlazeDS等远程通信和基于消息的基础设施,讨论了Flex与Java的集成方式。此外,还提到了流式传输的相关内容。 - **第8章:PHP与Flex** 介绍了一种开源的远程库AMFPHP,它可以用于连接PHP和Flex。本章还展示了...
FABridge,另一方面,是Flash与JavaScript之间的通信桥梁。它允许Flex应用程序与网页中的JavaScript对象交互,反之亦然。这在需要集成Flex UI与网页的其他动态元素,比如Ajax功能时非常有用。FABridge简化了跨技术...
《聚焦音乐:FlashMX/Flex与Java的交互实践》 在数字媒体领域,FlashMX/Flex和Java一直是构建动态、互动用户体验的重要工具。本资源"focus_music.rar"为我们提供了一个结合了这两种技术的实例——一个集音乐展示与...
26.1.2ActionScript与JavaScript交互 566 26.1.3ActionScript与桌面程序交互 567 26.2网页脚本交互示例 568 26.3桌面应用交互示例 571 26.4小结 573 第27章ActionScript打印控制 574 27.1使用打印作业对象 574 ...
**Android 移动开发——基于Adobe AIR 源代码** 在Android移动开发中,Adobe AIR(Adobe Integrated Runtime)提供了一种跨平台的方式,允许开发者使用熟悉的Flash、Flex或ActionScript技术来构建原生的移动应用。...
`callIFrameFunction()`方法用于跨域调用JS函数,而`ExternalInterface`类则提供了AS与浏览器环境之间的通信桥梁。 总结起来,flexIframas的核心在于通过IFrame组件和AS的`ExternalInterface`类实现AS与JS的交互,...
这种编程风格简化了UI的构建过程,使得界面设计更接近于视觉布局,降低了学习曲线,尤其是对于熟悉Flex或Flash Builder的开发者来说。 在"zk.pdf"这个文档中,可能涵盖了以下内容: 1. **ZK框架基础**:介绍了ZK...
常见的RIA框架和技术包括Adobe Flash、Flex,Microsoft Silverlight,以及JavaScript库如Ajax和现在的AngularJS、ReactJS等。在本课程中,我们将重点关注如何使用这些技术构建Fego城市,这是一个模拟现实世界的虚拟...
- **基于Flash的Flex**:Adobe公司的一种用于构建跨平台富互联网应用的技术。 ##### 2. 搭建开发运行环境 - **本书的Ajax环境**:介绍了本书使用的开发环境和技术栈。 - **Windows下JDK的安装**:详细步骤指导...