javascript - Js 音频音量 slider

标签 javascript html audio html5-audio volume

我是新手,我有一个问题。我怎样才能放一个音量 slider ?谢谢!!
我暂时找不到任何适合我的代码,希望您能帮助

HTML: <a id="play-pause-button" class="fa fa-play">
JavaScript:

<script type="text/javascript">
  var audio = new Audio("http://21273.live.streamtheworld.com/LOS40_DANCE.mp3");
$('#play-pause-button').on("click",function(){
  if($(this).hasClass('fa-play'))
   {
     $(this).removeClass('fa-play');
     $(this).addClass('fa-pause');
     autoplay = true;
     audio.play();
     audio.muted = false;
   }
  else
   {
    audio.muted = true;
     $(this).removeClass('fa-pause');
     $(this).addClass('fa-play');
   }
});

audio.onended = function() {
     $("#play-pause-button").removeClass('fa-pause');
     $("#play-pause-button").addClass('fa-play');
};

</script>

最佳答案

我已经对此进行了测试,并且可以正常工作。
HTML

<input type="range" id="volume-control">
JS
let audio = new Audio("http://21273.live.streamtheworld.com/LOS40_DANCE.mp3");

let volume = document.querySelector("#volume-control");
volume.addEventListener("change", function(e) {
audio.volume = e.currentTarget.value / 100;
})
我希望它有帮助

关于javascript - Js 音频音量 slider ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62160275/

相关文章:

javascript - Fiori 中的 session 超时 : Does SAP UI5 or the Gateway layer provide an event which gets called when the user's session times out

Javascript 按 JSON 对象中的值递增数组中的值

php - 向音频添加文本以进行加密

c# - Windows Audio 8.1 XAML背景音频崩溃

javascript - 使用 javascript 而非 jQuery 的简单 ajax 表单

javascript - DropzoneJS 和 Laravel - 输出表单验证错误

javascript - jQuery 可排序添加额外信息

android - Chrome Mobile,更改系统导航栏(后退、主页、最近按钮)背景颜色?

javascript - 主页文本区域更改

audio - 如何解决 “have subtitle controller already set”错误?