[实践OK] 播放音乐方法(兼容IE FF Chrome Opera Safari)

jackxiang 2015-8-17 22:41

背景：想在树莓派上使用，Raspberry Pi下的chromium没有声音，但在电脑上的FF和Chrome有声音。

/** 音乐播放器
 * @param obj   播放器id
 * @param file   音频文件 mp3: ogg:
 * @param loop  是否循环
 */
 function audioplayer(id, file, loop){
   var audioplayer = document.getElementById(id);
   if(audioplayer!=null){
     document.body.removeChild(audioplayer);
   }

if(typeof(file)!='undefined'){
     if(navigator.userAgent.indexOf("MSIE")>0){  // IE
    
      var player = document.createElement('bgsound');
      player.id = id;
      player.src = file['mp3'];
      player.setAttribute('autostart', 'true');
      if(loop){
        player.setAttribute('loop', 'infinite');
      }
      document.body.appendChild(player);
     
     }else{  // Other FF Chome Safari Opera
    
      var player = document.createElement('audio');
      player.id = id;
      player.setAttribute('autoplay','autoplay');
      if(loop){
        player.setAttribute('loop','loop');
      }
      document.body.appendChild(player);
      
      var mp3 = document.createElement('source');
      mp3.src = file['mp3'];
      mp3.type= 'audio/mpeg';
      player.appendChild(mp3);
      
      var ogg = document.createElement('source');
      ogg.src = file['ogg'];
      ogg.type= 'audio/ogg';
      player.appendChild(ogg);
     
     }
   }
 }

Demo：

来自：http://blog.csdn.net/fdipzone/article/details/8170337

作者：jackxiang@向东博客专注WEB应用构架之美 --- 构架之美，在于尽态极妍 | 应用之美，在于药到病除
地址：https://jackxiang.com/post/8221/
版权所有。转载时必须以链接形式注明作者和原始出处及本声明！

最后编辑： jackxiang 编辑于2015-8-18 12:21

[实践OK]Telnet模拟http请求下的Host设置HOST: ju

firefox 阻止此页面创建其他对话框的解决方法

评论列表

向东博客专注WEB应用构架之美 --- 构架之美，在于尽态极妍 | 应用之美，在于药到病除|赢在IT，Playin' with IT,Focus on Killer Application,Marketing Meets Technology.

[实践OK] 播放音乐方法(兼容IE FF Chrome Opera Safari)

分类

最新日志

链接

向东博客 专注WEB应用 构架之美 --- 构架之美，在于尽态极妍 | 应用之美，在于药到病除|赢在IT，Playin' with IT,Focus on Killer Application,Marketing Meets Technology.

[实践OK] 播放音乐方法(兼容IE FF Chrome Opera Safari)

分类

最新日志

链接

向东博客专注WEB应用构架之美 --- 构架之美，在于尽态极妍 | 应用之美，在于药到病除|赢在IT，Playin' with IT,Focus on Killer Application,Marketing Meets Technology.