5

是否可以通过 Modernizr 检测浏览器是否支持 Html5 音频?如果是这样,这是如何完成的?如果没有,是否有任何解决方法?Google 上很少有资源可以解释这一点,因此我们将不胜感激。

4

4 回答 4

8

是的,通过modernizr.audio。它支持多种音频格式(当前为 ogg、mp3、m4a 和 wmv)。例子:

var audio = new Audio();
audio.src = Modernizr.audio.ogg ? 'background.ogg' :
            Modernizr.audio.mp3 ? 'background.mp3' :
                                  'background.m4a';
audio.play();

文档中的更多信息。

于 2011-10-23T17:28:50.840 回答
2

是的,根据文档(这是一个链接),Modernizr 检测到音频支持,其中甚至包括一个代码示例(复制如下):

var audio = new Audio();
audio.src = Modernizr.audio.ogg ? 'background.ogg' :
            Modernizr.audio.mp3 ? 'background.mp3' :
                                  'background.m4a';
audio.play();
于 2011-10-23T17:29:09.927 回答
1

我找到了这段代码,它对我来说很好用:

<!DOCTYPE html>
<html>  
<head>
<title>Play Audio</title>
<script src="script/jquery-1.6.2.min.js" type="text/javascript"></script>
<script src="script/modernizr-latest.js" type="text/javascript"></script>
<script type="text/javascript">
var currentFile = "";
function playAudio() {

    var oAudio = document.getElementById('myaudio');
    // See if we already loaded this audio file.
    if ($("#audiofile").val() !== currentFile) {
        oAudio.src = $("#audiofile").val();
        currentFile = $("#audiofile").val();
    }
        var test = $("#myaudio");
        test.src = $("#audiofile").val();
    oAudio.play();   
}

$(function() {
    if (Modernizr.audio) {
        if (Modernizr.audio.wav) {
            $("#audiofile").val("sounds/sample.wav"); 
        }
        if (Modernizr.audio.mp3) {
            $("#audiofile").val("sounds/sample.mp3");
        }
    }
    else {
      $("#HTML5Audio").hide();
      $("#OldSound").html('<embed src="sounds/sample.wav" autostart=false width=1 height=1 id="LegacySound" enablejavascript="true" >');
    }

});
</script>
</head>

<body>
<div style="text-align: center;"> 
 <h1>Click to Play Sound<br /></h1>
<div id="HTML5Audio">
<input id="audiofile" type="text" value="" style="display: none;"/><br />

<button id="play" onclick="playAudio();">
    Play
</button>
</div>
<audio id="myaudio">
    <script>
    function LegacyPlaySound(soundobj) {
      var thissound=document.getElementById(soundobj);
      thissound.Play();
    }
    </script>
    <span id="OldSound"></span>        
    <input type="button" value="Play Sound" onClick="LegacyPlaySound('LegacySound')">
</audio>

只需在文件夹中添加具有正确名称的音频,然后添加带有 Jquery 内容的现代化器文件,您就完成了。

于 2012-09-19T16:37:22.860 回答
0

是的。http://www.modernizr.com/docs/#installing半途而废。

于 2011-10-23T17:31:15.120 回答