用SWFObject的动态方法来嵌入Flash内容

最新推荐文章于 2025-07-26 16:01:21 发布

原创最新推荐文章于 2025-07-26 16:01:21 发布 · 217 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #xhtml #ViewUI

Flex 相关专栏收录该内容

12 篇文章

订阅专栏

本文详细介绍了如何使用SWFObject动态嵌入Flash内容到HTML页面中，包括创建替换内容、引入JavaScript库、以及使用JavaScript嵌入SWF文件的步骤。同时提供了配置Flash内容的方法和使用JavaScript对象定义flashvars、params和attributes的指南。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

转：http://gray.topdrupal.com/SWFObject-dynamic

第一步：用符合标准的标签创建替换内容

SWFObject的动态嵌入方法遵循渐进增强（progressive enhancement）的原则，当浏览器对JavaScript和Flash插件有足够支持的时候，SWFObject会用Flash内容替换HTML内容。首先定义你的替换内容，并且为它添加一个id属性：

代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>SWFObject v2.0 dynamic embed - step 1 </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<div id="myContent">
<p>Alternative content </p>
</div>
</body>
</html>

第二步：在HTML页面的head标签中包括SWFObject JavaScript类库

SWFObject的JavaScript类库由一个外部JavaScript文件（大小：10.7Kb，GZIPed：3.5Kb）组成。 SWFObject会在外部JavaScript文件被加载后立即被执行，并且对于那些支持DomLoad事件的浏览器，例如 IE、Firefox、Safari和Opera 9+，SWFObject将会在DOM被加载后完成所有的DOM操作，而如果浏览器不支持DomLoad事件，所有DOM操作将会在页面的onload事件被触发后执行。

代码如下：

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>SWFObject v2.0 dynamic embed - step 2 </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="swfobject.js"></script>
</head>
<body>
<div id="myContent">
<p>Alternative content </p>
</div>
</body>
</html>

第三步：用JavaScript嵌入你的SWF

swfobject.embedSWF(swfUrl, id, width, height, version, expressInstallSwfurl, flashvars, params, attributes)有5个必须的参数和4个可选的参数：

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，可选的）指定express install SWF的URL并激活Adobe express install 。
flashvars（String，可选的）用name:value对指定你的flashvars。
params（String，可选的）用name:value对指定你的嵌套object元素的params。
attributes（String，可选的）用name:value对指定object的属性。

注意：在不破坏参数顺序的情况下，你可以忽略可选参数。如果你不想使用一个可选参数，但是会使用后面的一个可选参数，你可以简单的传入false作为参数的值。对flashvars、 params和 attributes这些JavaScript对象来说，你也可以相应的传入一个空对象{}。

代码如下：

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>SWFObject v2.0 dynamic embed - step 3 </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0");
</script>
</head>
<body>
<div id="myContent">
<p>Alternative content </p>
</div>
</body>
</html>

怎样配置你的Flash内容？

你可以为你的object元素添加下面这些常用的可选属性（attributes）：

id
name
styleclass（不使用class，因为class也是ECMA4的保留关键字）s
align

你可以使用下面这些专用于Flash的可选param元素

play
loop
menu
quality
scale
salign
wmode
bgcolor
base
swliveconnect
flashvars
devicefont
allowscriptaccess
seamlesstabbing
allowfullscreen
allownetworking

怎样用JavaScript对象来定义你的flashvars、params和attributes？

你最好用对象的字面量（Object literal notation）来定义JavaScrpt对象，例如这样：

代码如下：

<script type = "text/javascript" >
var flashvars = { } ;
var params = { } ;
var attributes = { } ;
swfobject. embedSWF ( "myContent.swf" , "myContent" , "300" , "120" , "9.0.0" , "expressInstall.swf" , flashvars , params , attributes ) ;
</script >

你可以在定义对象的时候添加你的name:value对（注意：请确保不要再对象中的最后一个name:value对后面加上逗号）：

<script type = "text/javascript" >
var flashvars = {
name1 : "hello" ,
name2 : "world" ,
name3 : "foobar"
} ;
var params = {
menu : "false"
} ;
var attributes = {
id : "myDynamicContent" ,
name : "myDynamicContent"
} ;
swfobject. embedSWF ( "myContent.swf" , "myContent" , "300" , "120" , "9.0.0" , "expressInstall.swf" , flashvars , params , attributes ) ;
</script >

或者在对象创建之后用点号添加属性（properties）和值：

<script type = "text/javascript" >
var flashvars = { } ;
flashvars. name1 = "hello" ;
flashvars. name2 = "world" ;
flashvars. name3 = "foobar" ;
var params = { } ;
params. menu = "false" ;
var attributes = { } ;
attributes. id = "myDynamicContent" ;
attributes. name = "myDynamicContent" ;
swfobject. embedSWF ( "myContent.swf" , "myContent" , "300" , "120" , "9.0.0" , "expressInstall.swf" , flashvars , params , attributes ) ;
</script >

上面的代码也可以这样写（为那些喜欢单行代码的顽固脚本程序员准备的不易读的简写版本）：

<script type = "text/javascript" >
swfobject. embedSWF ( "myContent.swf" , "myContent" , "300" , "120" , "9.0.0" , "expressInstall.swf" , {name1 : "hello" ,name2 : "world" ,name3 : "foobar" } , {menu : "false" } , {id : "myDynamicContent" , name : "myDynamicContent" } ) ;
</script >

如果你不想使用一个参数，你可以将它定义为false或者一个空对象：

<script type = "text/javascript" >
var flashvars = false ;
var params = { } ;
var attributes = {
id : "myDynamicContent" ,
name : "myDynamicContent"
} ;
swfobject. embedSWF ( "myContent.swf" , "myContent" , "300" , "120" , "9.0.0" , "expressInstall.swf" , flashvars , params , attributes ) ;
</script >

flashvars对象是一个为了增加易用性而设计的作为快捷方式的参数，所以你可以先忽略它，然后在params对象中指定你的flashvars：

<script type = "text/javascript" >
var flashvars = false ;
var params = {
menu : "false" ,
flashvars : "name1=hello&name2=world&name3=foobar"
} ;
var attributes = {
id : "myDynamicContent" ,
name : "myDynamicContent"
} ;
swfobject. embedSWF ( "myContent.swf" , "myContent" , "300" , "120" , "9.0.0" , "expressInstall.swf" , flashvars , params , attributes ) ;
</script >