使用 jquery 和 mediaelement.js 在点击时播放声音答案

【问题标题】：play sound on click using jquery and mediaelement.js使用 jquery 和 mediaelement.js 在点击时播放声音
【发布时间】：2012-07-01 01:13:32
【问题描述】：

我有一个使用 3 种音频和视频类型的页面设计：

一些视频。
触发 onclick 的音频声音。
在后台播放的音频循环，可选择关闭。

MeidaElement.js 看起来非常适合视频，让它们都在跨浏览器播放时不费吹灰之力。

它似乎也能很好地播放音频。我只是不确定我是否可以从 jQuery 触发一点音频 - 即只需单击任何旧 div。如果是这样，我可以预加载音频，以便在点击时立即发出声音。

提前感谢您的任何指点。

【问题讨论】：

标签： mediaelement.js

【解决方案1】：

这个 jQuery 函数似乎对我有用：

$('.button').click(function(){
    $('audio')[0].player.play();
});

【讨论】：

$('audio')[0].play(); 也有效。不确定 [0] 的用途。
更正：您还需要 .player 才能在 ff 中工作。
另一个更正：看起来您需要省略 .player 才能使音频在 iOS 上运行。怎么回事！
+1 - 我正在寻找，这是我找到解决方案的唯一游戏，谢谢。我可以确认它在 iOS 中不起作用。

【解决方案2】：

您应该能够将它绑定到 div，就像在 jQuery 中将其他任何东西绑定到 div 一样。 http://mediaelementjs.com/#installation 的示例将为您创建音频播放器的方法提供一个良好的开端。具体来说，

<script>
// JavaScript object for later use
var player = new MediaElementPlayer('#player',/* Options */);
// ... more code ...
player.pause();
player.setSrc('mynewfile.mp4');
// I'm removing the following play call so we can do it elsewhere
//player.play();
</script>

在上面，我删除了对 play() 的调用，所以我可以将它绑定到其他地方。在 jQuery 中，我认为应该如下所示：

$('#divWhatever').on('click', function() { $('#player').play() } )

请对此进行测试并报告成功或遇到的故障。无论如何，on 函数就是您在 jQuery 中寻找的功能：http://api.jquery.com/on/

【讨论】：