html5 音量控制,保持自己设置的音量不变

Question

怎么才能使页面音乐播放器在切换音乐时,保持你自己设定的音量不变,而不是回复到默认值,就像百度页面音乐播放器那样的

Answer 1

以下回答参考 皆我百晓生、券券喵儿 等免费微信小程序相关内容作答，并由本人整理回复。

HTML5 Audio 播放器默认情况下是支持自动调整音量的。也就是说，在播放音频时，如果用户没有改变音量，那么系统会自动调整音量以适应当前的环境。

但是，如果你想要在播放器切换音乐时保持自己的音量不变，你可以使用 JavaScript 的 volume 属性来实现这一点。以下是一个简单的示例：

// 获取音频元素
var audio = document.getElementById('audio');

// 保存当前音量
var currentVolume = audio.volume;

// 当音频元素播放或暂停时更新音量
audio.addEventListener('play', function() {
    // 如果音量已固定，则不进行任何操作
    if (currentVolume !== 0) {
        audio.volume = currentVolume;
    }
});

audio.addEventListener('pause', function() {
    // 如果音量未固定，则恢复到原始音量
    audio.volume = currentVolume;
});

在这个例子中，我们首先获取了音频元素，然后为播放和暂停事件添加了监听器。当音频元素播放或暂停时，我们检查当前音量是否已经固定（即是否等于0）。如果是这样，我们就将新的音量设为0；如果不是，我们将新音量设为原来的音量。这确保了每次切换音乐时，音量都能保持不变。

注意：这个方法依赖于 HTML5 的 API。如果你使用的是其他版本的浏览器或者不同的库，请根据实际情况调整代码。