使用SWFObject2.2.js让网页播放消息提示音（附源码下载）

      最近在优化毕业设计时，突然想起当收到聊天信息时，没有通知提醒的声音，所以在网上找了一些相关的播放声音的插件，由于SWFObject相当轻量化（只有10K），而且实现起来还是挺方便的，所以决定使用SWFObject.js 来实现这个小功能。

一、准备工作

1.  下载 swfobject2.2.zip

2.  下载一个能播放mp3格式消息声的swf文件，我们接下来的主要工作是控制这个swf文件来播放消息音乐。

别急，以上两个文件包 在文章结尾附下载  

二、开始

根据官方网站上介绍，使用SWFObject有两种方法可以插入flash文件到网页上。（第一种方法只略作介绍）

第一种方法：

该方法首先要在网页文件中写好object标签及相关参数，然后在页面载入时调用 swfobject.registerObject 注册该对象。虽然这种方法能获得较好的嵌入flash文件的性能，但由于需要事先写好<object>这段代码，对于实现播放消息通知声音这个小功能来说，没有太大的性能需求，这里只略作介绍。

第二种方法：

先放上代码

我们首先需要在网页中写一个有id属性的<div>层，然后在页面载入时调用swfobject.embedSWF方法即可动态产生一个object替换掉div层，从firebug中查看网页源代码

从产生的代码中很容易就可以看出该方法是第一种方法的简化版。下面先来说说swfobject.embedSWF 方法里面的设置参数swfobject.embedSWF方法的语句格式为：

swfobject.embedSWF(swfUrl, id, width, height, version, expressInstallSwfurl, flashvars, params, attributes, callbackFn)

其中前5个参数是必须的，后5个参数是可选的

swfUrl：嵌入的flash的路径，即该例子中sound.swf的路径。

id：是我们在网页中写的那个<div>层的id。

width,height:嵌入的flash的宽、高。

version：这个参数是嵌入的flash发布时的版本。

expressInstallSwfurl：这里填入 expressInstall.swf  文件的路径。当用户的浏览器的flash版本低于versioin的值时，启动该flash来下载最新的flash，而且该flash只在第一次触发时启动。

flashvars：该参数是传入到flash文件里面使用的，在我们这个例子中，就是动态的设置这个参数来传入要播放的mp3文件。

params：有下列这些可选项

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

我们这里只用到了wmode，设置该选项为transparent，设为transparent不至于让flash悬浮在页面顶层。

attributes：有下列这些选项

• id
• align
• name
• styleclass
• class

callbackFn：无论是否成功添加<object>到页面中，都会触发该回调函数。

简单的了解swfobject.embedSWF方法后，就可以实现播放消息声音的功能了。

我们可以看到

这段函数中，swfobject.getObjectById是取得<object>对象，获得该对象后，我们就可以控制该flash文件了。

这里sound.SetVariable("f", c)是动态地设置传入到flash的参数，而设定 f，是由于该flash设定了传入变量名称  f 为mp3文件的路径。（即变量名称必须为 f，才能有效果）

sound.GotoFrame(1)的意思是转到该flash文件的第一帧，这里可能需要一点flash知识才能明白，不过应该不影响该例子的描述。

最后，只要点击播放按钮，就可以听到消息声音了。

 

三、总结

虽然没什么技术含量，但是可以锻炼下写文章的技巧。感觉一个简单的小功能让自己说复杂了，还望见谅。

如有错误，欢迎指正，谢谢。

 

四、相关下载

SwfObjectDemo

swfobject_2_2.zip

转载于:https://www.cnblogs.com/sharpCode/archive/2011/12/04/2276012.html