embed标签:如何用js控制音乐的播放和停止

你都不说清楚你的embed标签里是什么元素，
如果是Windows Media Player的话，可以obj为Mediaplayer对象
obj.controls.pause(); 暂停
obj.controls.play(); 播放
obj.controls.stop();停止Flash播放器的话需要flash内部支持传入参数.

最好用OBJECT标签来嵌入MediaPlayer，如果直接用Embed，接口不明确
就算是MediaPlayer,不同版本的方法也是不同的

给个示例代码，自己改音乐网址就行了
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>MediaPlayer示例</title>
    <style type="text/css">
        body
        {
         font-size:12px;
         font-family:宋体;
        }
        #divMpl
        {
            height: 137px;
            width: 277px;
        }
        #divMsg
        {
            height: 155px;
            overflow:auto;
            width: 376px;
        }
    </style>
    <script language="javascript" type="text/javascript">
    /* MediaPlayer类定义 */
    function MediaPlayer()
    {
        this.dom=null;
    }
    MediaPlayer.uiMode=
    {
        Full:"full",
        Mini:"mini",
        None:"none",
        Invisible:"invisible"
    }
    MediaPlayer.prototype={
        //在指定ID的标签中创建MediaPlayer控件，大小由该标签决定
         CreateAt:function(id)
        {
            this.dom=document.createElement("object");
            this.dom.classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6";
            this.dom.style.width="100%";
            this.dom.style.height="100%";
            var container=document.getElementById(id);
            container.innerHTML="";
            container.appendChild(this.dom);
            this._Init();
        },

        //绑定一个已存在的Object标签，该标签应该为一个MediaPlayer控件
         BindID:function(id)
        {
            this.dom=document.getElementById(id);
            this._Init();
        },
        _Init:function()    //初始化，注册事件
        {
            var _this=this;
            if(!window.attachEvent)
            {
                this.dom.attachEvent=function(evn,fun)
                {
                }
            }
            this.dom.attachEvent("PlayStateChange",
                function(newState){_this.onPlayStateChange(newState)});
            this.dom.attachEvent("Buffering",function(bStart){ _this.onBuffering(bStart) });
            this.dom.attachEvent("Error",function(){ _this.onError(); });
            this.dom.attachEvent("PositionChange",
                function(oldPos,newPos){ _this.onPositionChange(oldPos,newPos); } );
            this.dom.attachEvent("StatusChange",function(){ _this.onStatusChange(); })
        },
        onPlayStateChange:function(newState)
        {
            switch(newState)
            {
            case 1: //wmppsStopped
                this.onStop();
                break;
            case 2:  //wmppsPaused
                this.onPaused();
                break;
            case 3:  //wmppsPlaying
                this.onPlay();
                break;
            case 4:  //wmppsScanForward
                break;
            case 5:  //wmppsScanReverse
                break;
            case 6:  //wmppsBuffering
                this.onBuffering_SC();
                break;
            case 7:  //wmppsWaiting
                break;
            case 8:  //wmppsMediaEnded
                this.onMediaEnded();
                break;
            case 9:  //wmppsTransitioning
                this.onTransitioning();
                break;
            case 10:  //wmppsReady
                break;
            case 11:  //wmppsReconnecting
                break;
            case 12:  //wmppsLast
                break;
            case 0:  //wmppsUndefined
                break;
            default:
                break;
            }
        },
        // 事件列表
         onStop:function(){},
        onPaused:function(){},
        onPlay:function(){},
        onBuffering_SC:function(){},
        onTransitioning:function(){},
        onMediaEnded:function(){},
        onError:function(){},
        onPositionChange:function(oldPos,newPos){},
        onStatusChange:function(){},
        onBuffering:function(bStart){},

        // 设置暂时只做两个
         setMode:function(mode){ this.dom.uiMode=mode; },
        setVolume:function(v){ this.dom.settings.volume=v; },

        // 各种属性
        getMediaName:function()
        {
            var media=this.dom.currentMedia;
            if(media)
            {
                return media.name;
            }
            return "";
        },
        getMediaDuration:function()
        {
            var media=this.dom.currentMedia;
            if(media)
            {
                return media.duration;
            }
            return "";
        },
        getMediaDurationString:function()
        {
            var media=this.dom.currentMedia;
            if(media)
            {
                return media.durationString;
            }
            return "";
        },
        getStatus:function(){ return this.dom.status; },
        getPosition:function(){ return this.dom.controls.currentPosition; },
        getPositionString:function(){ return this.dom.controls.currentPositionString; },
        getPlayState:function(){ return this.dom.playState; },

        // 操作方法
         OpenUrl:function(URL){ this.dom.URL=URL; },
        Play:function(){ this.dom.controls.play(); },
        Pause:function(){ this.dom.controls.pause();},
        Stop:function(){ this.dom.controls.stop(); }
    }
    /* MediaPlayer类定义 */

    var mpl=new MediaPlayer();  //创建一个MediaPlayer
    window.onload=function()
    {
        mpl.CreateAt("divMpl"); //在divMpl中创建MediaPlayer
        mpl.setVolume(100);  //设置音量
        mpl.setMode(MediaPlayer.uiMode.Full); //设置显示模式         //事件响应代码
        mpl.onPlay=function(){ ShowMessage("正在播放["+this.getMediaName()+"]"); };
        mpl.onPaused=function(){ ShowMessage("暂停"); };
        mpl.onMediaEnded=function(){ ShowMessage("播放结束"); };
        mpl.onStop=function(){ ShowMessage("停止"); };
        mpl.onPositionChange=function(oldPos,newPos){
            var pos1={
                min:parseInt(oldPos/60),
                sec:parseInt(oldPos%60)
            }
            var pos2={
                min:parseInt(newPos/60),
                sec:parseInt(newPos%60)
            }
            ShowMessage(pos1.min+":"+pos1.sec+ "->"+ pos2.min+":"+pos2.sec);
        };
        //mpl.onStatusChange=function(){ ShowMessage(this.getStatus()); };
        mpl.OpenUrl("DuskToDawn.wma");  //打开音乐
        window.setInterval("ShowPlayTime()",1000);
    }
    //显示播放时间
    function ShowPlayTime()
    {
        if(mpl.getPlayState()==3)
        {
            ShowStatus(mpl.getPositionString());
        }
    }
    function ShowMessage(str)
    {
        var msg=document.getElementById("divMsg");
        var tn=document.createTextNode(str);
        msg.appendChild(tn);
        msg.appendChild(document.createElement("br"));
    }
    function ShowStatus(str)
    {
        document.getElementById("divStatus").innerHTML=str;
    }
    </script>
</head>
<body>
<div id="divMpl"></div>
<div id="divStatus"> </div>

    <input type="button" value="清空消息" onclick="document.getElementById('divMsg').innerHTML='';" />
    <div id="divMsg"></div>
</body>
</html>

<body>
<div id="divMpl"></div>
<div id="divStatus"> </div>

    <input type="button" value="清空消息" onclick="document.getElementById('divMsg').innerHTML='';" />
    <div id="divMsg"></div>
</body>
冰点大哥问个问题啊<div id="divMpl"></div>  <div id="divMsg"></div>这两个层干什么用的？还有那个清空消息清空的是什么歌曲吗？还是divMsg层中的内容？

第一个问题，请看代码注释： mpl.CreateAt("divMpl"); //在divMpl中创建MediaPlayer第二个问题，divMsg是显示事件的一个div，比如暂停、开始、拖动音乐进度都会在这个div中显示相应的内容。清空消息的作用就是清空这些内容。只是展示上的一小示例而已

我代码是这样的：

另外我希望能同时支持火狐和ie 6+.
或者大家推荐别的标签也行，bgsound呢只适用于 IE，在netscape 和 firefox 中并不适用,但是貌似也没有别的标签可以用了

要同时兼容火狐和ie 6+.，看来只能自己写一个音乐播放的控件了。
好环躁~~~偶仅仅是想控制播放个背景音乐而已，为什么如此一个常见而普通的功能，浏览器却没有提供这样的标签？
希望HTML5中能够有这样的标签。结贴啦

这个怎么解决的呀，embed用display都不行

调试易

embed标签:如何用js控制音乐的播放和停止

解决方案 »