flex与html交互和js调用

Flex与Html交互获得参数

1. 在html页面包含swf

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
    id="${application}" width="${width}" height="${height}"

    codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
    <param name="movie" value="${swf}.swf" />
    <param name="quality" value="high" />
    <param name="bgcolor" value="${bgcolor}" />
    <param name="allowScriptAccess" value="sameDomain" />
    <param name="FlashVars" value="param1=one&param2=2&param3=3&param4=four" />
    <embed src="${swf}.swf" quality="high" bgcolor="${bgcolor}"
        width="${width}" height="${height}" name="${application}" align="middle"
        play="true"
        loop="false"
        quality="high"
        allowScriptAccess="sameDomain"
        type="application/x-shockwave-flash"
        pluginspage="http://www.adobe.com/go/getflashplayer"
        FlashVars="param1=one&param2=2&param3=3&param4=four"
    </embed>
< /object>

这里关键是FlashVars="param1=one&param2=2&param3=3&param4=four"
这FlashVars把参数传给了swf文件

2. flex中函数



private function onCreationComplete() : void

{

    var parameters : Object = Application.application.parameters;

    var param1 : String = parameters.param1;

    var param2 : int = parseInt( parameters.param2 );

    var param3 : int = parseInt( parameters.param3 );

    var param4 : String = parameters.param4;



    output.text = "param1: " + param1 + "/n" +

                  "param2: " + param2 + "/n" +

                  "param3: " + param3 + "/n" +

                  "param4: " + param4;

}
在flex中用Application.application.parameters来获取上面所传的参数



转自:http://blog.csdn.net/friendyi/archive/2008/07/15/2651777.aspx



------------------------------------------------------------------------------------------------------------------

Flex与JavaScript的交互

一、在JavaScript中调用Flex方法
在 Flex 应用中,需要在方法列表中添加指定的公用方法,这样Flex中的方法才能被JS调用到。在Flex中需要通过调用addCallback()可以把一个方 法添加到此列表中。 addCallback将一个ActionScript的方法注册为一个JavaScript和VBScript可以调用的方法。
addCallback()函数的定义如下:
addCallback(function_name:String, closure:Function):void
function_name参数就是在Html页面中脚本调用的方法名。closure参数是要调用的本地方法,这个参数可以是一个方法也可以是对象实例。


举个例子:

 
01. <mx:script>
02.     import flash.external.*;
03.     public functionmyFunc():Number {
04.         return83;
05.     }
06.     public functioninitApp():void {
07.         ExternalInterface.addCallback("myFlexFunction",myFunc);
08.     }
09. </mx:script>

那么在Html页面中,先获得SWF对象的引用,也就是用
 
1. <object...id="MyFlexApp"></object>
声明的Swf的Id属性,比如说是MyFlexApp。然后就可以用以下方式调用Flex中的方法。
 
1. <script language="JavaScript">
2.     functioncallApp() {
3.         varx = MyFlexApp.myFlexFunction();
4.         alert(x);
5.     }
6. </script>
 
1. <inputonclick="callApp()"value="Test"type="button">


二、在Flex中调用 JavaScript
同样,我们也可以调用Html页面中的JavaScript,通过与JavaScript的交互,可以改变Style,调用远程方法。还可以将数据传递给Html页面,处理后再返回给Flex,完成这样的功能主要有两种方法:ExternalInterface()和navigateToUrl()。
在Flex中调用JavaScript最简单的方法是使用ExternalInterface(),可以使用此API调用任意JavaScript,传递参数,获得返回值,如果调用失败,Flex抛出一个异常。
ExternalInterface封装了对浏览器支持的检查,可以用available属性来查看。
ExternalInterface的使用非常简单,语法如下:
flash.external.ExternalInterface.call(function_name: String[, arg1, ...]):Object;
参数function_name是要调用的JavaScript的函数名,后面的参数是JavaScript需要的参数。
举个例子说明如何调用JavaScript函数
Flex应用中,添加如下方法:
 
01. <mx:script>
02.
03. <mx:application xmlns:mx="http://www.adobe.com/2006/mxml">
04.     <mx:script>
05.         import flash.external.*;
06.    
07.         public functioncallWrapper():void {
08.             varf:String = "changeDocumentTitle";
09.             varm:String = ExternalInterface.call(f,"New Title");
10.             trace(m);
11.         }
12.     </mx:script>
13.     <mx:button label="Change Document Title"click="callWrapper()">
14. </mx:button></mx:application></mx:script>


Html页面中有如下函数定义:
 
1. <script language="JavaScript">
2.     functionchangeDocumentTitle(a){
3.         window.document.title = a;
4.         return"successful";
5.     }
6. </script>
转自:http://www.idceye.com/index-blog-view-id216.html

------------------------------------------------------------------------------------------------------------------------------------



Flex程序与包装页面(wrapper)通信方法小结

        Flex通常作为一个web项目的一部分嵌入到一个web页中,因此Flex程序和web页面的通信就变得非常重要。

1)  Flex提供了多种方法实现 Flex程序和封装页面的交互,主要有:flashVars属性,查询字符串参数,navigateToURL()方法,以及flash.external.ExternalInterface类。
2)    Flex程序 获取环境信息: Application.application.url获取封装页面的URL,以及使用@ContextRoot()以及可以通国 flash.system.Capacities获取到有关系统的一些信息,比如版本、语言、操作系统等;
3)    flashVars用来从外部封装页面向 Flex程序传送数据:
         在封装页面传入参数值:AC_FL_RunContent(flashVars, “para1=value1&…&paran=valuen”)或者
<Object>
    <param name=”movie” value=”wrapper.swf? para1=value1 />
    <embed src=”wrapper.swf?para1=value1/>
                  </Object>
                 然后flex程序里通过 Application.application.parameters.para1获取参数值;
4)    ExternalInterface提供方法使 Flex程序和外部的封装页面可以相互调用对方的方法,外部接口类要受到域安全性设置(allowScriptAccess, allowNetworking)的约束。
先判断 ExternalInterface是否可用:
ExternalInterface.available;
flex调用 js:
ExternalInterface.call(funName, funPara1, …, funParaN);
js调用 flex:
首先 flex里面用ExternalInterface.addCallback(“jsFunName”,asFun),将AS里面定义的函数赋予一个js里面调用的函数的名字jsFunName;
然后在 js里面用mySwf.jsFunName()调用flex里面提供的函数asFun;
ExternalInterface安全性:
一般来说 js和flex的访问局限于同一个域之内。
可以设置 <Object>和<Embed>的allowScriptAccess=”value”(value取值:never, always, sameDomain默认)来设置flex访问js的权限。
至于 js对于flex方法的访问只有flex里面通过addCallback的js才可以访问,对于跨域,可以试用allowDomain()函数设置。
5)    navigateToURL() 可以用来打开一个新的浏览器窗口,也可以用来flex和js之间的通信。比如 :
         打开一个新窗口:
var url:URLRequest = new URLRequest( http://blog.csdn.net);
navigateToURL(url, _blank);
这个函数也可以用来执行 js,例如:
var url:URLRequest = new URLRequest(“javascript:window.close()”); 或者:
var urlLURLRequest = new URLRequest(“javascript:myFun(para1…paran)”)
myFun()函数是html页面的script部分定义的,函数参数一定要有引号!
navigateToURL(url, _self);
也可以用来发送 email:
var urlURLRequest = new URLRequest( mailto:zoushun@hotmail.com);
navigateToURL(url, _blank);
转自:http://blog.csdn.net/arshoon/archive/2008/06/11/2533982.aspx
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 公司年会滚动抽奖系统的HTML源码是用来构建网页界面的代码,通常包括HTML标签、CSS样式表和JavaScript脚本。 HTML标签用于定义网页的结构,如头部、主体和底部,以及各个元素的属性和内容。在公司年会滚动抽奖系统的HTML源码中,可能会包含抽奖界面的布局和各个操作按钮的定义。 CSS样式表用于美化界面,通过定义元素的样式和布局,可以使界面看起来更加美观和一致。在公司年会滚动抽奖系统的HTML源码中,可能会包含各个元素的颜色、大小、字体等样式的定义。 JavaScript脚本用于实现网页的交互功能,通过定义事件和处理函数,可以实现抽奖系统的滚动效果、抽奖号码的生成和展示等功能。在公司年会滚动抽奖系统的HTML源码中,可能会包含抽奖逻辑的实现,如随机生成中奖号码和滚动展示中奖结果的动画效果。 总之,公司年会滚动抽奖系统的HTML源码是通过HTML标签、CSS样式表和JavaScript脚本共同构建的,用于实现抽奖系统的界面展示和交互功能。这些源码的编写和组合可以根据具体需求进行调整和优化,以实现更好的用户体验和系统性能。 ### 回答2: 公司年会滚动抽奖系统的HTML源码是一个网页的源代码,主要用于构建具有滚动抽奖功能的网页页面。以下是一个简化的HTML源码示例: ``` <!DOCTYPE html> <html> <head> <title>公司年会滚动抽奖系统</title> <style> /* CSS样式表用于美化页面样式 */ body { font-family: Arial, sans-serif; background-color: #f2f2f2; } .container { max-width: 800px; margin: 0 auto; padding: 20px; background-color: white; border: 1px solid #ccc; border-radius: 5px; } h1 { text-align: center; } .winner { color: #ff0000; font-size: 24px; font-weight: bold; text-align: center; margin-bottom: 30px; } .button { display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-decoration: none; border-radius: 5px; } </style> <script> // JavaScript代码用于控制抽奖逻辑 function roll() { // 这里编写抽奖滚动逻辑 // 当点击抽奖按钮后,滚动指针,最终停留在一个抽奖结果上 // 将抽奖结果显示在页面上的.winner元素中 } </script> </head> <body> <div class="container"> <h1>公司年会滚动抽奖系统</h1> <div class="winner"></div> <button class="button" onclick="roll()">点击抽奖</button> </div> </body> </html> ``` 以上示例中的代码为公司年会滚动抽奖系统提供了一个基本的页面结构和样式,并包含了一个抽奖按钮和一个用于显示抽奖结果的区域。在具体的JavaScript代码中,可以根据需要编写抽奖逻辑,实现抽奖滚动和停止,并将最终的抽奖结果展示在页面上。当用户点击抽奖按钮时,调用JavaScript中的`roll()`函数触发抽奖逻辑。 ### 回答3: 公司年会滚动抽奖系统的HTML源码如下: ```html <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>公司年会滚动抽奖系统</title> <style> .container { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh; } .button { padding: 10px 20px; background-color: #f0f0f0; color: #333; border: none; border-radius: 5px; cursor: pointer; } #result { margin-top: 20px; font-weight: bold; } </style> </head> <body> <div class="container"> <h1>公司年会滚动抽奖系统</h1> <button class="button" onclick="startLottery()">开始抽奖</button> <div id="result"></div> </div> <script> var participants = ["员工A", "员工B", "员工C", "员工D", "员工E"]; // 参与抽奖的员工名单 function startLottery() { var resultElement = document.getElementById("result"); // 生成一个随机数作为索引,从参与抽奖的员工名单中获取一个幸运员工 var randomIndex = Math.floor(Math.random() * participants.length); var luckyParticipant = participants[randomIndex]; resultElement.innerText = "恭喜 " + luckyParticipant + " 中奖啦!"; } </script> </body> </html> ``` 以上是一个简单的公司年会滚动抽奖系统的HTML源码。界面中包含一个抽奖按钮和一个用于展示中奖结果的文本框。点击"开始抽奖"按钮会在参与抽奖的员工名单中随机选择一个员工,并将结果显示在文本框中。参与抽奖的员工名单可以通过修改JavaScript代码中的`participants`数组来支持不同的名单。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值