我创建了一个简单的音频 slider (感谢这里的很多答案)，当用户单击 slider 时，它会自动播放一些音频(音量为零)，然后允许他们根据需要增加音量。
我唯一的问题是，当用户拖动 slider 时，音量不会稳定增加，而是仅在用户用鼠标释放 slider 时调整音量。无论如何，我是否可以仅通过 slider 本身的移动来实现恒定的音量调节。任何帮助将不胜感激
JS
var mediaClip;
var volume1;
function init()
{
mediaClip = document.getElementById("mediaClip");
volume1 = document.getElementById("volume1");
mediaClip.play();
}
function setVolume() {
var mediaClip = document.getElementById("mediaClip");
mediaClip.volume = document.getElementById("volume1").value;
}
function play() {
var audio = document.getElementById("mediaClip");
audio.play();
}
HTML
<body onload="init()">
<audio id="mediaClip" src="A Very Brady Special.mp3" style="display:none" allow="autoplay" controls>
<p>Your browser does not support the audio element</p>
</audio>
<input type="range" onchange="setVolume()" id='volume1' min=0 max=1 step=0.01 value='0' onclick="play()">
</body>
最佳答案
简单地使用
<input type="range" oninput="setVolume()" id='volume1' min=0 max=1 step=0.01 value='0' onclick="play()">
而不是
<input type="range" onchange="setVolume()" id='volume1' min=0 max=1 step=0.01 value='0' onclick="play()">
关于javascript - 使用 HTML 和 JS 改进音量 slider ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/60355315/