在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在上面的代碼。 乾杯！