个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
如何让 Html5 音频在点击时播放声音？ (ogg 用于 Firefox 等浏览器，mp3 用于 chrome 等浏览器)
到目前为止，我可以通过 onclick 更改为单个文件类型，但我无法像在普通的 html5 音频声明中那样让它具有备份选项，即
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
代码:
<!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>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>How do i call the javascript function and get it to play .ogg if can't play .mp3?</title>
</head>
<body>
<audio id="Mp3Me" autoplay autobuffer controls>
<source src="Piano.mp3">
</audio>
<a href="javascript:GuitarTrack()">Guitar</a>
<script type="text/javascript">
function GuitarTrack(){
var Mp3Me= document.getElementById('Mp3Me');
Mp3Me.src = "Guitar.mp3";
Mp3Me.src = "Guitar.ogg";
}
</script>
</body>
</html>
最佳答案
因为您只创建一个 <source>元素，您必须创建另一个 <source> HTML 中的元素或使用 JavaScript 创建一个元素。
使用 HTML 创建第二个元素。 http://jsfiddle.net/PVqvC/
<audio id="Mp3Me" autoplay autobuffer controls>
<source src="Piano.mp3">
<source src="Piano.ogg">
</audio>
<a href="javascript:GuitarTrack();">Guitar</a>
<script type="text/javascript">
function GuitarTrack(){
var Mp3Me= document.getElementById('Mp3Me');
Mp3Me.children[0].src = "Guitar.mp3";
Mp3Me.children[1].src = "Guitar.ogg";
Mp3Me.load();
}
</script>
使用 JS 创建第二个元素。 http://jsfiddle.net/MBvsC/1/
<audio id="Mp3Me" autoplay autobuffer controls>
<source src="Piano.mp3">
</audio>
<a href="javascript:GuitarTrack();">Guitar</a>
<script type="text/javascript">
function GuitarTrack(){
var Mp3Me= document.getElementById('Mp3Me').getElementsByTagName('source');
if(Mp3Me.length > 1) { //there are 2 elements
Mp3Me[0].src = "Guitar.mp3";
Mp3Me[1].src = "Guitar.ogg";
}
if(Mp3Me.length == 1) { //only one element, so we need to create the second one
Mp3Me[0].src = "Guitar.mp3"; //changes existing element
var node = document.getElementById('Mp3Me');
var newelem = document.createElement('source');
newelem.setAttribute('src', 'Guitar.ogg');
node.appendChild(newelem); //creating new element with appropriate src
}
Mp3Me.load();
}
</script>
如您所见，第一种方法更短更简洁，所以如果您可以使用它，请使用它。如果您有任何其他问题 - 请随时提问。
关于javascript - 如何让 Html5 音频在点击时播放声音？ (ogg 用于 Firefox 等浏览器，mp3 用于 chrome 等浏览器)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15317318/
24
4
0
我正在使用 libogg 和 libogg，我已成功将这些库添加到我的 iPhone xCode 项目并使用 Speex 对我的声音进行编码。问题是我不知道如何用 ogg 打包这些音频数据包。有人知道
我正在使用 libogg 和 libogg，我已成功将这些库添加到我的 iPhone xCode 项目并使用 Speex 对我的声音进行编码。问题是我不知道如何用 ogg 打包这些音频数据包。有人知道
我正在使用 Ogg Vorbis SPI作为解码 .ogg 文件的一种方式。 我用于加载 .ogg 文件并转换为 PCM 的代码片段与文档中建议的代码片段没有太大的不同: // The streams
您好，我一直在尝试使用本教程安装带有一些库的 FFmpeg https://trac.ffmpeg.org/wiki/CompilationGuide/Centos?version=85 使用此命令安
我正在尝试更改我的视频的帧速率。下面是示例输入和输出。我自己构建了 ffmpeg，我很确定我错过了正确的解码器/解复用器，但我不知道我需要什么。我认为 --enable-libtheora 足以启用多
关闭。这个问题是off-topic .它目前不接受答案。 想改进这个问题？ Update the question所以它是on-topic对于堆栈溢出。 9年前关闭。 Improve this que
我有一个名为setSound()的方法，该方法设置队列并向其中添加轨道，然后播放。我在simpleInitGame()中调用该方法。但是没有声音播放，eclipse中的控制台说: Mar 13, 20
关闭。这个问题是off-topic .它目前不接受答案。 想改进这个问题吗？ Update the question所以它是on-topic用于堆栈溢出。 关闭 10 年前。 Improve thi
最近我试图了解如何ogg vorbis在里面工作，所以我为 ogg vorbis 编写了简单的编码器/解码器.现在我试图了解所有互联网 ogg 广播电台是如何工作的。我不明白的事情:如果您需要处理所有
有时音乐甚至没有开始播放，但是当开始播放时，它会在几秒钟后停止。文件长 2 分钟。我真的不知道是什么问题。 @Override public void onCreate(Bundle savedIns
当我看到 http://www.vorbis.com/music/Hydrate-Kenny_Beltrey.ogg 时，我感到非常惊讶链接没有给我下载选项，但有一个播放器不是 flash 播放音频。
我尝试使用标签音频。将 mp3 转换为 ogg 使用 ffmpeg -i "123.mp3" "1234.ogg" .ogg 的服务器响应内容类型，例如 video/ogg。我尝试了内容类型的 au
现在我正在制作一个服务器，用 HTML 显示视频。我尝试在我的计算机上使用 ..mp4 和 .ogg 视频，效果非常好。但是当我尝试使用移动设备时，只显示 .mp4，而 .ogg 没有显示。移动设备无
我正在尝试将章节添加到包含 vorbis 音频的 ogg 文件中。 来自 this link我复制了以下 ffmpeg 命令。 ffmpeg -threads auto -y -i in.ogg -i
如果我将带有专辑封面的音频文件转换为: ffmpeg -i sample1.flac -ar 48000 -vn -c:a libvorbis -b:a 320k sample1.ogg 我的 sam
回答问题 "How-to make a silent mp3 or wav-file" on ubuntuforums.org FakeOutdoorsman 提供了以下配方: Another met
我正在尝试从浏览器捕获用户的音频输入。我已经用 WAV 完成了，但是文件真的很大。我的一个 friend 告诉我，OGG 文件要小得多。 有谁知道如何将WAV转换为OGG？ 我也有原始数据缓冲区，我真
是否有一个模块支持在 Windows 上的 Python 2.6 中播放 Ogg/Speex(不是 Ogg/Vorbis)编码文件的音频？ 最佳答案 到目前为止，VLC Python 绑定(bind)
我有三个声音文件:sound1.ogg，sound2.ogg和sound3.ogg。每个文件的长度都是几秒钟，并存储在我项目的/res/raw文件夹中。 我希望它们在我的main_activity上的
我正在尝试从远程服务器获取ogg音频文件，并将播放器呈现给用户。我正在使用下面的代码。 这导致没有输出。但是检查代码可以发现音频标签在容器中: 但是，它在Firefox的检查器中显示为灰色。 DOM
我是一名优秀的程序员,十分优秀！