sup*_*iox 10 javascript mp3 cross-browser
哪种是通过javascript播放mp3(非常短)文件的最佳和跨浏览器方式？我试过不同的方法,但总是有问题......
编辑1:
我不需要一个"完整"的播放器,我只需要一个功能,而不是每当有事情发生时我都可以调用
编辑2:
好的,我要更好地解释我的问题.服务器是连接在局域网中的智能手机,但并不总是连接到互联网.我想使用mp3,因为文件重量只有3kb(而不是60kb的wav),但如果播放此文件的机制太"重"(播放器或jquery.js),我认为最好使用wav文件.其他建议？
Tie*_*ies 17
用这个:
new Audio('your/url/here').play()
HTMLAudioElement可以在MDN上找到this()的文档,请注意大多数控件都是继承的HTMLMediaElement.
只需直接下载到音频文件即可加载页面.检测浏览器是否支持MP3.如果是,则逐步增强直接下载到AUDIO标签.这是一个示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Audio demo</title>
<script src="http://cdnjs.cloudflare.com/ajax/libs/modernizr/2.0.6/modernizr.min.js"></script>
</head>
<body>
<p id="audio">
<a href="BadAppleEnglish.mp3">Listen »</a>
</p>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>
<script src="audio.js"></script>
</body>
</html>
和Javascript:
$(function () {
var audioElement = $('#audio'),
href = audioElement.children('a').attr('href');
$.template('audioTemplate', '<audio src="${src}" controls>');
if (Modernizr.audio.mp3) {
audioElement.empty();
$.tmpl('audioTemplate', {src: href}).appendTo(audioElement);
}
});
我想大多数数以万计的预制MP3播放插件都是这样的.
更新:
由于您已经编辑了问题以指定您更喜欢不使用jQuery的解决方案,我将指出重写此不使用jQuery是微不足道的.它只是更长,更不优雅.请记住,从CDN加载的Javascript库通常由浏览器缓存.
| 归档时间： |
|
| 查看次数： |
13481 次 |
| 最近记录： |