所以，在编码方面我是一个完全的业余爱好者，但我仍然喜欢摆弄它。 我目前正在开发一个基于 html/jS/PHP 的音板，但我不知道如何在按下按钮播放另一个按钮时停止播放声音。
<script type="text/javascript" charset="utf-8">
$(function() {
$("audio").removeAttr("controls").each(function(i, audioElement) {
var audio = $(this);
var that = this; //closure to keep reference to current audio tag
$("#doc").append($('<button>'+audio.attr("title")+'</button>').click(function() {
that.play();
}));
});
});
</script>
我希望有人能理解这一点。提前致谢。 还有一个 PHP 代码可以自动从文件夹中获取音频文件到前端，对于这个问题可能是不必要的信息。
最佳答案
如果您使用引入了 HTMLAudioElement 的 HTML5，这并不是很难做到的。 .
这是您想要执行的操作的最少代码:
// Let's create a soundboard module ("sb")
var sb = {
song: null,
init: function () {
sb.song = new Audio();
sb.listeners();
},
listeners: function () {
$("button").click(sb.play);
},
play: function (e) {
sb.song.src = e.target.value;
sb.song.play();
}
};
$(document).ready(sb.init);<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Audio</title>
</head>
<body>
<button value="https://www.gnu.org/music/FreeSWSong.ogg">Song #1</button>
<button value="https://www.gnu.org/music/free-software-song-herzog.ogg">Song #2</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</body>
</html>您还可以考虑像 howler.js 这样的库在开发过程中为您提供帮助。
关于当另一个声音开始时，Javascript 停止播放声音，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43430897/