Question

当播放器的音量变化时，我正在尝试更换音量图像但是使用此代码，第二个else if不起作用，
并且不显示3°图像（VOL-1.png）...

所有其他图像（VOL-off，VOL-2，VOL-on）正确显示...

var myVideo1 = document.getElementById('myVideo1');
var bttnMuteUnmute = document.getElementById("bottoncinoMuteUnmute_myVideo1");

myVideo1.addEventListener("volumechange", function () {
    if (myVideo1.muted || myVideo1.volume <= 0.009) {
        bttnMuteUnmute.style.backgroundImage = "url(buttons-VOL-off.png)";
    } else if (myVideo1.volume <= 0.65) {
        bttnMuteUnmute.style.backgroundImage = "url(buttons-VOL-2.png)";
    } else if (myVideo1.volume <= 0.4) {
        bttnMuteUnmute.style.backgroundImage = "url(buttons-VOL-1.png)";
    } else {
        bttnMuteUnmute.style.backgroundImage = "url(buttons-VOL-on.png)";
    }
}, false);

我做错了什么？

Answer 1

任何小于0.4的数字也将小于0.65。因此，当数字小于0.4时，它与<= 0.65进行比较，它是Truthy，因此显示VOL-2图片。

所以，你只需要改变条件的顺序，比如

...
} else if (myVideo1.volume <= 0.4) {
bttnMuteUnmute.style.backgroundImage = "url(buttons-VOL-1.png)";
} else if (myVideo1.volume <= 0.65) {
bttnMuteUnmute.style.backgroundImage = "url(buttons-VOL-2.png)";
} else {
...

Answer 2

由于if-else语句按顺序进行评估，因此它会卡在VOL-2中，因为VOL-1的任何选项也符合VOL-2。如果您要切换VOL-1和VOL-2的顺序，它应该可以工作。

如果不起作用，其他多个语句

2 个答案: