问题:如何使用javascript向SWF文件传递参数?

在网上找了一个完整的教程,很有启发性和实用性,如下是完整实现的步骤:

配置SwfObject:

Swfobject2是目前检测用户是否安装Flash的最佳方法。它被认为是‘行业标准',并且Adobe所有产品的新版本(Flex4,Flash CS5)都会使用SwfObject来检测Flash Player。

先要下载,解压ZIP文件,复制swfobject.js文件到你的web服务器上,根目录下创建名为'js'根文件夹是个不错的想法。(因此文件位置应该是http://myserver.com/js/swfobject.js)。我们会在以后创建的HTML文件中参考这个文件的。如果你想使用ExpressInstall功能(为用户提供简单的升级方法),你必须将expressInstall.swf复制到相同的文件夹下。

配置HTML文件:

HTML文件包括两个Javascript。一个用来抓取来自网址的参数。这是由Matt White创建的,它虽然简单但十分有效。代码如下:

/* Get URL Parameter in Javascript. Code from: http://mattwhite.me/11tmr.nsf/D6Plinks/MWHE-695L9Z */

function getURLParam(strParamName){

var strReturn = "";

var strHref = window.location.href;

if ( strHref.indexOf("?") > -1 ){

var strQueryString = strHref.substr(strHref.indexOf("?"));

var aQueryString = strQueryString.split("&");

for ( var iParam = 0; iParam < aQueryString.length; iParam++ ){

if ( aQueryString[iParam].indexOf(strParamName.toLowerCase() + "=") > -1 ){

var aParam = aQueryString[iParam].split("=");

strReturn = aParam[1];

break;

}

}

}

return unescape(strReturn);

}

将如上代码放置到你的HTML文件的HEAD标签中。你同样需要将导入SWFObject脚本导入进来,代码如下:

另一个Javascript是使用SwfObject插入SWF文件。你可以将其放置在HTML文件的任何地方。首先我们要做的是创建一个DIV标签,在没有安装合适的Flash Player时提示用户。

This content requires Flash Player 9 (or a more recent version).

Make sure JavaScript is turned on.

You need to

upgrade your Flash Player

在DIV标签内你可以输入任何想输入的内容。添加图片或者反馈信息随你喜欢,因为这些内容都会被SWF文件所替换。

接下来是实现替换功能的Javascript:

var flashvars = { test:getURLParam("test") };

var params = {};

var attributes = {};

swfobject.embedSWF("/articlefiles/jsvars/jsvars.swf", "flashcontent", "550", "400", "9.0.0","", flashvars, params, attributes);

注意第二行,我们调用了Javascript函数'getURLParam',这个函数已经被插入到HTML文件中。我们所传递的名字正是希望从网址中捕获的参数名。

创建Flash文件

接下来该创建Flash文件了。将一个文本框添加到舞台上。在属性面板中设置为'动态文本',实例名为'mytextField'。通过点击'显示文本周围边框'实现在选中文本框时显示边框。

捕获传递进来的参数需要使用如下的try/catch语句:

try {

var key:String; // This will contain the name of the parameter

var val:String; // This will contain the value of the parameter

var flashvars:Object = LoaderInfo(this.root.loaderInfo).parameters;

for (key in flashvars) {

val = String(flashvars[key]);

mytextField.text = key+": "+val;

}

} catch (error:Error) {

// what to do if an error occurs

}

文件:jsvars_test.fla

将文件和HTML文件一并上传到服务器上。当运行文件时,你会看到文本框中的'test:'字样。

注意:如果SWF无法显示,你只看到了'升级Flash Player'字样,说明服务器上缺少某些东西。确保你已经将SwfObject文件(swfobject.js)上传到了http://myserver.com/js/swfobject.js。同时确保HTML文件中的SwfObject文件和SWF文件路径正确。如果仍然有问题,查看一下例子的源文件及路径。

接下来,试着像这样添加test参数http://www.flashmagazine.com/articlefiles/jsvars/jsvars_test.html?test=something.如果一切正常,你将会看到'test:something',表明你已经成功的将参数传递到Flash文件中。

更进一步

你同样可以设置来自SWF文件的参数。在这个例子中http://www.flashmagazine.com/articlefiles/jsvars/jsvars.html?test=something&id=someID我们同样实现了发送参数。

FLA文件包含两个分别命名为'variablesReceived'和'variablesToSend'的文本框,以及一个用来发送新参数的按钮。这个例子的HTMl文件被设置接收'test'和'id'两个参数。首先我们为第一个文本框添加一些说明性文字:

variablesReceived.text ="Variables passed in:" + " ";接下来该接收变量了:

try {

var key:String;

var val:String;

var flashvars:Object = LoaderInfo(this.root.loaderInfo).parameters;

for (key in flashvars) {

val = String(flashvars[key]);

variablesReceived.appendText("\t" + key + ": " + val + " ");

}

} catch (error:Error) {

variablesReceived.appendText(error.toString());

}

这将会在第一个文本框中列举出所有的flashvars。我们在这个文件中使用到的另一个主要函数就是发送变量函数:

// Sending parameters

function sendVariables(e:MouseEvent):void {

// First we grab the URL of the HTML document and split it into an array

var htmlUrl:String = ExternalInterface.call("window.location.href.toString");

// split the string at the questionmark

var splitUrl:Array = htmlUrl.split("?");

// use only the first part (ditch existing parameters)

var trimmedUrl:String = splitUrl[0];

// get the parameters we want to append to the URL

var parameters:String = variablesToSend.text;

// combine url and parameters with a new questionmark

var requester:URLRequest = new URLRequest(trimmedUrl+"?"+parameters);

// reload the page

navigateToURL(requester, '_self');

}

这里我们使用了一个小小技巧,通过使用'ExternalInterface.call'捕获SWF文件插入的HTML文本的网址。Flash文件只知道指向自身的网址,这个技巧突破了这个限制。ExternalInterface在SwfObject默认情况下是被打开的,但你可以手动关闭它。

我们不需要当前网址中的参数(也就是'…?test=something&id=5′)。因此我们只保留了问号之前的部分并将其存储在'trimmedUrl'变量中以备将来之用。我们捕获'variablesToSend'文本框中的参数,并将其传递到URLRequest中。通过将request传递给'navigateToURL',浏览器会重新加载HTML页面并在'variablesReceived'文本框中显示最近提交的值对。

注意:你不能在Flash中测试它。需要将文件上传到服务器上,因为FlashVars和ExternalInterface都需要SWF被插入到浏览器中。

最后我们必须使用addEventListener为发送按钮设置调用'sendVariables'方法。

sendButton.addEventListener(MouseEvent.CLICK,sendVariables);现在你已经知道如何使用Javascript相互传递参数了。让我们用我们的所学做一些有用的事情。

创建记录状态的导航

结束之前,让我们构建一个小型菜单系统,这个系统可以高亮显示当前的点击按钮,你可以下载已完成文件或者运行案例,让我们看一下代码:

首先停止SWF的时间轴播放,为鼠标点击设置事件监听器。

stop();

// setup our 5 buttons

item1.addEventListener(MouseEvent.CLICK, gotoURL);

item2.addEventListener(MouseEvent.CLICK, gotoURL);

item3.addEventListener(MouseEvent.CLICK, gotoURL);

item4.addEventListener(MouseEvent.CLICK, gotoURL);

item5.addEventListener(MouseEvent.CLICK, gotoURL);当仍然一个按钮被点击,他们都会执行'gotoURL'函数。接下来,我们捕获来自网址的参数:

// grab variables

try {

var key:String;

var val:String;

var flashvars:Object = LoaderInfo(this.root.loaderInfo).parameters;

for (key in flashvars) {

val = String(flashvars[key]);

if(key == "item"){ // If the parameter is called 'item'...

if(val.substr(0,4) == "item"){ // ... and the name of the button starts with the characters 'item'...

// ... we can extract the number-part of the item-name and go to the correct frame

var frameToGoTo:Number = Number( val.substr(4,1) );

gotoAndStop( frameToGoTo+1 );

}

}

}

} catch (error:Error) {

// what to do if an error occurs

}

正如你所看到的,这和之前的做法十分相似。但这次我们传递的参数名字为'item'。这个参数是我们点击的按钮的名字。

接下来是gotoURL函数。

// Get the new page

function gotoURL(e:MouseEvent):void {

// First we grab the URL of the HTML document and split it into an array

var htmlUrl:String = ExternalInterface.call("window.location.href.toString");

// split the string at the questionmark

var splitUrl:Array = htmlUrl.split("?");

// use only the first part (ditch existing parameters)

var trimmedUrl:String = splitUrl[0];

// get the name of the button clicked and set it as a parameter

var parameters:String = "item="+e.currentTarget.name;

// combine url and parameters with a new questionmark

var requester:URLRequest = new URLRequest(trimmedUrl+"?"+parameters);

// reload the page

navigateToURL(requester, '_self');

}

我们通过联合'item='字符以及点击的按钮名字创建自己的参数。然后将网址以及参数传递到navigateToURL方法中重新加载带有新参数的HTML页面。

事件是如何工作的:当一些东西被点击时我们使用addEventListener()方法监听点击事件,事件包含被点击的对象的引用。'currentTarget'属性会引用被点击的对象(e.currentTarget),这样一来我们就可以使用e.currentTarget.name获得其名字。

要成为一个完整的菜单系统,你还需要使加载新的网址,而不是像例子中使用相同的网址。你现在应该知道最基本的知识。它同时可以以多种方式运行。可以将网址当做变量存储在SWF中,从一个XML文件加载,或者更多其它的方式。因此我把这些交给你。如果你使用本教程创建了解决方案,请在评论中张贴网址,以便其他学习者可以看到它.

flash传值给javascript,并在html页面输出,javascript向flash swf文件传递参数值注意细节...相关推荐

  1. 页面中嵌入了Flash时滚动条问题

    用于解决在页面中嵌入了Flash时滚动条问题的处理 初始化加入以下代码: stage.addEventListener(MouseEvent.MOUSE_OVER,function (e:MouseE ...

  2. javascript(js)自动刷新页面的实现方法总结

    自动刷新页面的实现方法总结: 1) <meta http-equiv="refresh"content="10;url=跳转的页面"> 10表示间隔 ...

  3. java 网页保存为pdf文件怎么打开方式_js相关:JavaScript+Java实现HTML页面转为PDF文件保存的方法...

    js相关:JavaScript+Java实现HTML页面转为PDF文件保存的方法 发布于 2020-8-12| 复制链接 借助iText这个Java库,我们可以将HTML文件保存为图片文件进而转换成P ...

  4. [html] 页面中怎么嵌入Flash?有哪些方法?写出来

    [html] 页面中怎么嵌入Flash?有哪些方法?写出来 <object width="550" height="400"><param n ...

  5. JavaScript跳转到页面某个锚点#

    JavaScript跳转到页面某个锚点: scroll(0, document.getElementById('锚点ID').offsetTop); 转载于:https://www.cnblogs.c ...

  6. 小程序传值对象数值到另一个页面大小限制

    项目场景: 小程序页面与页面之间的传值 问题描述 我们在做页面之间的传值时,只传递了一部分数据,没有传递全 原因分析: 我们在做页面之间的传值时,因为url地址后面跟的数据大小是有限制的,如果数据小的 ...

  7. HTML+CSS+JavaScript 实现登录注册页面(超炫酷)

    1.临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手? 网页要求的总数量太多? 2.没有合适的模板?等等一系列问题.你想要解决的问题,在这篇博文中基本都能 ...

  8. js 向页面输出html,javascript怎么输出?

    JavaScript怎么输出?输出方式有哪些?下面本篇文章就给大家介绍JavaScript的几种输出方式,希望对大家有所帮助. 方法1:使用window.alert()进行输出 window.aler ...

  9. js 页面输出html,javascript中如何输出?

    面对刚刚学习JavaScript的同学们,你是否知道JavaScript如何输出?下面本篇文章就来给大家介绍一下javascript的几种输出方式,希望对大家有所帮助. JavaScript的输出方式 ...

最新文章

  1. 如何利用ArcGis修改shp数据字段名称
  2. 福布斯2019全球最佳创投人榜单发布,沈南鹏蝉联全球第一
  3. ms sql 主键自动生成32位guid
  4. unix amp; linux oralce用户 内存使用情况分析
  5. java在初始化过程_Java初始化过程
  6. 计算机组成原理第4章-指令系统
  7. 四年努力,梦归阿里,和大家聊聊成长感悟
  8. 【Java】一例贯通Java基础语法
  9. 21_python基础—单例和 __ new __ 方法
  10. php array 数组函数,php数组函数-array_地图()
  11. torch.eq(input, other, out=None)
  12. 我是谁:没有绝对安全的系统黑客手法介绍
  13. Kaspersky Anti-Virus NDIS Filter导致的网络故障一例
  14. 大学生HTML5竞赛网站,2019全国大学生信息安全竞赛Web Writeup
  15. mysql查询专业术语,英文术语MySQL查询
  16. java mail 邮箱发送_Java Mail 发送邮件
  17. rust门卡有什么用_屠龙之技! 使用Rust加速你的Python
  18. 100以内素数及其之和
  19. 中国商务礼仪培训市场趋势报告、技术动态创新及市场预测
  20. CSS element+element

热门文章

  1. mybatis分页应用
  2. 该怎么输出log?!
  3. “=” “:=” 区别
  4. 搭建windows的solr6服务器
  5. 你所能用到的数据结构之番外篇---逆袭的面向对象(一)
  6. CentOS内核升级
  7. 实录:oracle下大表清理整改
  8. 域环境安装企业从属CA两种方法
  9. 开源OS FreeBSD 中 ftpd chroot 本地提权漏洞 (CVE-2020-7468) 的技术分析
  10. 【通告更新】Apache Tomcat服务器文件包含漏洞安全风险通告第三次更新