问题:如何使用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创建的,它虽然简单但十分有效。代码如下: 复制代码 代码如下: <script type="text/javascript"> /* 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); } </script>
将如上代码放置到你的HTML文件的HEAD标签中。你同样需要将导入SWFObject脚本导入进来,代码如下: <script type="text/javascript" src="/js/swfobject.js"></script>另一个Javascript是使用SwfObject插入SWF文件。你可以将其放置在HTML文件的任何地方。首先我们要做的是创建一个DIV标签,在没有安装合适的Flash Player时提示用户。 复制代码 代码如下: <div id="flashcontent"> <strong>This content requires Flash Player 9 (or a more recent version). <noscript>Make sure JavaScript is turned on. </noscript> You need to <a href="http://www.adobe.com/shockwave/download/index.cgi?p1_prod_version=shockwaveflash" target="_blank"> <span style="text-decoration: underline;">upgrade your Flash Player</span></a></strong> </div>
在DIV标签内你可以输入任何想输入的内容。添加图片或者反馈信息随你喜欢,因为这些内容都会被SWF文件所替换。 接下来是实现替换功能的Javascript: 复制代码 代码如下: <script type="text/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); </script>
注意第二行,我们调用了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(" " + 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"); }
创建记录状态的导航 结束之前,让我们构建一个小型菜单系统,这个系统可以高亮显示当前的点击按钮,你可以下载已完成文件或者运行案例,让我们看一下代码: 首先停止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"); }