<audio>元素在Safari中根本不工作

我试图添加音乐到一个虚拟旅游应用程序我正在写JS和jQuery，到目前为止我的代码，如下所示，在Chrome，FF，IE9，和歌剧。但在Safari 5.1.7，这是你可以得到一台Windows计算机，它只是不工作......通过我的问题的研究最新的，我知道，Safari浏览器不会自动播放音乐，它必须启动手动，但是当我点击播放按钮时，没有任何反应。而且，顺便说一句，在Safari中的代码检查显示，我的音乐标签是没有用的音乐来源，所以我不认为这有什么用DOM。对我的问题有任何想法？<audio>元素在Safari中根本不工作

HTML：

<div id="musicBtns"> 
    <p>Music:</p> 
    <p id="musicPlayBtn">Play</p> 
    <p>/</p> 
    <p id="musicPauseBtn">Pause</p> 
</div>

我的音乐对象JS：

var Music = 
    { 
     musicBtns: $('#musicBtns'), 
     playBtn: $('#musicPlayBtn'), 
     pauseBtn: $('#musicPauseBtn'), 
     isPlaying: false, 

     init: function() 
     { 
      if(!music.includeMusic) // If the client didn't want any music in the tour app, remove the music btns from the DOM 
      { 
       this.musicBtns.remove(); 
      } 
      else // Else, setup the audio element 
      { 
       var parent = this; 
       var audio = $('<audio loop="true">'); 

       if(music.autoplay) 
       { 
        audio.attr('autoplay', 'autoplay'); 
        this.isPlaying = true; 
        this.togglePlayPause(); 
       } 

       // Add a source elements and appends them to the audio element 
       this.addSource(audio, music.ogg); // 'music.ogg' is a reference to the path in a JSON file 
       this.addSource(audio, music.mp3); 
       this.musicBtns.append(audio); 

       // Add event listeners for the play/pause btns 
       this.playBtn.click(function() 
       { 
        audio.trigger('play'); 
        parent.isPlaying = true; 
        parent.togglePlayPause(); 
       }); 

       this.pauseBtn.click(function() 
       { 
        audio.trigger('pause'); 
        parent.isPlaying = false; 
        parent.togglePlayPause(); 
       }); 
      } 
     }, 
     addSource: function(el, path) 
     { 
      el.append($('<source>').attr('src', path)); 
     }, 
     // Add or remove classes depending on the state of play/pause 
     togglePlayPause: function() 
     { 
      if(this.isPlaying) 
      { 
       this.playBtn.addClass('underline'); 
       this.pauseBtn.removeClass('underline'); 
      } 
      else 
      { 
       this.playBtn.removeClass('underline'); 
       this.pauseBtn.addClass('underline'); 
      } 
     } 
    }

编辑：难道这是在Safari中的错误？

来源

2013-03-12 Matt Whitehead

所以，问题竟然是用QuickTime。我想我必须在它删除了我的机器的一段时间回来，因为我不认为我需要它。我在重新安装了QuickTime，Safari浏览器使用没有问题的音频标签播放音乐。自动播放甚至可以起作用。

有趣的是，原生HTML5音频/视频支持的冠军，不支持HTML5音频/视频没有插件...

来源

2013-03-13 10:33:39

在Safari上HTML5视频我有这个问题，我不得不“负荷”（我认为它，要么启动缓冲或加载整个事情）之前，我将其设置为播放。这似乎确实让一些webkit浏览器能够正常工作。因此，像：

var a = new Audio("file.mp3"); 
a.load(); 
a.play();

值得一试

来源

2013-03-12 09:21:15 marksyzm

<audio>元素在Safari中根本不工作

回答

相关问题