Flash 与 JavaScript的交互：使用SWFObject来嵌入Flash文件

开门见山，我们先来了解一下SWFObject是什么？

　　swfobject 是一个js类库，它封装了许多方法，用这些方法可以：
　　　　1. 嵌入flash文件到页面中；
　　　　2. 检查客户端的FlashPlayer环境；  

　　swfobject 的优点：

• 　该模块中的JS脚本能够自动检测客户端机器上各种主流浏览器对Flash插件的支持情况。使得插入Flash媒体资源尽量简捷、安全。
• 　它非常符合搜索引擎优化的原则。能够避免您的HTML、XHTML文件中出现object、embed等非标准标签，从而符合更加标准。

　　swfobject的官方下载及文档地址：http://code.google.com/p/swfobject/;

 

再来看它的最简单的一种使用方式，直接上代码：

1 <script type="text/javascript" src="swfobject.js"></script> 
2 <script type="text/javascript">
3     swfobject.embedSWF("myflash.swf", "altContent", "300", "120", "9.0.0"); 
4 </script>
5 <div id="altContent">这里是flash内容，当前的浏览器没有安装或者FlashPlyaer版本不够高，请从<a href="http://www.adobe.com/go/getflashplayer">这里</a>下载安装最新的FlashPlyaer</div>

　　通过上面5句代码，就可以把一个Flash文件嵌入到html页面当中，是不是很爽！
　　简单介绍一下上面代码的意思：
　　　　第一行：在文件中引入 swfobject.js 这个文件；
　　　　2 - 4行：执行swfobject封装的embedSWF方法把myflash.swf文件嵌入到页面中 id 为 altContent的标签的位置并替换该标签；
　　　　　　　　 设置flash的宽高分别为：300、120；
　　　　　　　　 告诉浏览器运行 myflash.swf 所需要最低点FlashPlayear版本为 9.0.0;如果当前FlashPlayer过低，或者没有安装，则swfobject.embedSWF方法不会替换altContent标签，提示用户去升级FlashPlayer;

 

介绍一下SwfObject嵌入flash的详细方法：

 1 <script type="text/javascript" language="javascript">
 2 var flashvars = {
 3     id:"153322344343",
 4     age:"25",
 5     nickName:"ASV5"
 6 }
 7 var params = {
 8     menu: "false",
 9     allowFullscreen: "false",
10     allowScriptAccess: "always",
11     bgcolor: "#ffffff",
12     wmode: "window"
13 }
14 var attributes = {
15     id:"test"
16 }
17 swfobject.embedSWF("myflash.swf?home=beijing", "altContent", "100%", "100%", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
18     
19 </script>
20 
21 
22 
23 <!-- 要被flash文件替换的标签位置 -->
24 <div id="altContent">
25     <h1>Flashvars Demo</h1><!-- 此处为该flash的相关名称或功能描述 -->
26     <p><a href="http://www.adobe.com/go/getflashplayer">安装最新的FlashPlayer</a></p>
27 </div>
28 <!-- /要被flash文件替换的标签位置 -->

　　
　　先定义flashvars、params 和 attributes 三个初始化Flash需要的变量:

　　　　flashvars 　　一个json对象，为flash传递一些初始化信息；
　　　　params　　　设置flash的一些渲染模式和背景颜色，缩放模式，右键菜单、是否允许flash访问js里面的方法等；
　　　　attributes 　 设置嵌入flash完成时object标签的id，name等属性；

　　现在我们详细介绍一下swfobject.embedSWF方法，该方法共需要10个参数： 

swfobject.embedSWF(swfUrlStr, replaceElemIdStr, widthStr, heightStr, swfVersionStr, xiSwfUrlStr, flashvarsObj, parObj, attObj, callbackFn)

swfUrl（String ，必须的）指定SWF的URL。
id（String ，必须的）指定将会被Flash内容替换的HTML元素的id。
width（String，必须的）指定SWF的宽。
height（String，必须的）指定SWF的高。
version（String，必须的）指定你发布的SWF对应的Flash Player版本（格式为：major.minor.release）。
expressInstallSwfurl（String，可选）指定expressInstall.swf的URL并在客户端FlashPlyaer版本低于version指定的数值时激活Adobe express install自动升级客户端的FlashPlyaer。
flashvars（ Object ,可选）用name:value对指定你的flashvars。
params（Object ,可选）用name:value对指定你的嵌套object元素的params。
Attributes（Object, 可选）用name:value对指定object的属性。
callbackFn（JavaScript function, 可选）定义一个在执行embedSWF方法后，嵌入flash成功或失败后都可以回调的js 函数

　　对于不需要的参数可以省略，但是前五个参数是不能省略的；如果某个参数不需要，而其后面需要设置某个值的时候，请用 null 关键字占位，如：

　　swfobject.embedSWF("swf/test.swf", "altContent", "100%", "100%", "9.0.0", null, flashvars, params, attributes);

 

下面说一下swfobject检测客户端环境的方法体现：

　　1）<div id="altContent"></div>

　　上面的例子我们可以看到在这个div里面还有一些关于你要嵌入的Flash的一些简单描述和一个最新FlashPlayer的链接地址。
　　这个DIV很重要，它的作用就是在如果客户端没有安装FlashPlayer或者FlashPlayer的版本不够高，这段标签将不被替换，以达到提示用户这部门内容要安装FlashPlayer才能正确显示。

　　2）swfobject.embedSWF方法里面的version参数；

　　version参数告知了swfobject在满足那个Flahsplayer版本时才会替换上面的div标签，正确嵌入Flash文件，否则就不替换。

　　3）swfobject.embedSWF方法里面的 expressInstallSwfurl 参数

　　expressInstallSwfurl 参数是一个Adobe提供的用于自动升级FlashPlyaer的一个swf文件，当客户端安装了FlashPlayer 6+ 的版本，
　　又达不到 verison参数描述的版本时，swfobject就会在页面里面显示这个expressinstall.swf文件，它会提醒你是否要自动升级FlashPlayer。

 

　　另外，swfobject 还提供了两个检测FlashPlayer版本的方法：

　　　　swfobject.getFlashPlayerVersion()
　　　　返回一个包含了已安装Flash Player主要版本（major:Number）、次要版本、minor:Number）、发行版本（release:Number）的JavaScript对象。

　　　　swfobject.hasFlashPlayerVersion(versionStr)
　　　　返回一个Boolean值，表明特定版本的Flash插件是否已被安装; 如：swfobject.hasFlashPlayerVersion(“9.0.124”)

好了关于swfobject嵌入Flash的方法就介绍到这里，了解更多可以去官网。