gpt4 book ai didi

audio - HTML音频播放/停止

转载 作者:行者123 更新时间:2023-12-02 22:21:15 29 4
gpt4 key购买 nike

我正在制作一个聊天应用程序,功能之一就是发送声音。发送的HTML如下:

<p>
<audio autoplay>
<source src="sounds/lol.mp3" type="audio/mpeg">
</audio>
LOL
<a href="#" id="soundStop">Stop</a>
<a href="#" id="soundPlay" style="display:none;">Play</a>
</p>

第一次发送时,“自动播放”效果很好。因此,现在我需要一个播放/停止链接,以根据需要多次听到声音。我有以下Javascript:
$(document).on('click', '#soundStop', function(e) {
$(this).hide();
$(this).next("a").show();
$('audio').each(function(){
this.pause();
this.currentTime = 0;
});
e.preventDefault();
});

$(document).on('click', '#soundPlay', function(e) {
$(this).hide();
$(this).prev("a").show();
$(this).closest("audio").play();
//alert("play sound again!");
e.preventDefault();
});

停止功能有效(尽管我不确定以所有“音频”元素为目标是个好主意)。但是我在第二个函数中坚持如何将音频元素定位到.play()。我可能会以完全错误的方式进行操作?

任何帮助或建议,不胜感激。

编辑:为了澄清起见,可能会发送这些声音的多个实例,这就是为什么我需要一种只针对每个特定“音频”的方法。

最佳答案

为什么不使用音频的“准备使用控件”。它会达到您的目的。

尝试以下代码:

<!DOCTYPE html>
<html>
<body>
<audio autoplay controls>
<source src="horse.ogg" type="audio/ogg">
</audio>

</body>
</html>

客户控制
<!DOCTYPE html>
<html>
<body>
<audio id="player" src="horse.ogg"></audio>
<div>
<button onclick="document.getElementById('player').play()">Play</button>
<button onclick="document.getElementById('player').pause()">Pause</button>
<button onclick="document.getElementById('player').volume+=0.1">Volume Up</button>
<button onclick="document.getElementById('player').volume-=0.1">Volume Down</button>
</div>
</body>
</html>

关于audio - HTML音频播放/停止,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17381239/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com