在javascript中降低html音频的音量

Question

我想在用户单击图像时减少<audio>的音量。

---

HTML：

<div id="cloud"> 
<img name="jsVolumeButton" src="images/cloud.png" width = "140px"/> </div> 
<audio id="player" src="sounds/rain.MP3" autoplay loop></audio> 

JS：

var myimgobj = document.images.jsVolumeButton.onclick(); 
var mysoundobj = document.sounds.player; 
function onclick() { 
if(document.getElementById('player').volume === 0){ 
    document.getElementById('player').volume = 1; 
}else 
    document.getElementById('player').volume -= 0.1; 
    return true; 
} 

正如你看到的，我的HTML/JS的知识是非常有限的。我到目前为止只做了C++，只是做了一些学习，但是我正在碰壁，我需要问。

我想单击图像并将音量降低0.1。如果它达到0，我希望它再次以全音量播放。我认为这应该是可能的。

Answer 1

好吧，我知道了： HTML：

<img name="jsVolumeButton" src="images/cloud.png" width = "140px" onClick="onClickImage()"/> </div> 

JS：

function onClickImage() { 
    document.getElementById('player').volume -= 0.2; 
    if(document.getElementById('player').volume <= 0.1){ 
    document.getElementById('player').volume += 1; 
} 
    return true; 
} 

Answer 2

我认为有一个比你正在尝试做的更简单，更有效的解决方案。

只需使用一个HTML属性controls这样的：

<audio src="Your/src.mp3" controls></audio> 

注意的controls在上面的代码。 干杯！