Question

每次执行该代码时，我都有此代码可用于淡入和淡出视频标签的音频。

  var allVideos = document.getElementsByTagName('video');
           if (0 < allVideos[0].volume && allVideos[0].volume <= 1){
             fadeOutFunction();
             console.log("Entered first if statment");
}   else if (allVideos[0].volume == 0) {
             fadeInFunction();
};

        function fadeOutFunction() {
         var value = 0.01;
         var myVar = setInterval(myTimer, 10);
         function myTimer() {


         if(allVideos[0].volume != 0){
            allVideos[0].volume -= value;
         } else if(allVideos[0].volume == 0){
             clearInterval(myVar);
         }
         }
        }
           function fadeInFunction() {
         var value = 0.01;
         var myVar = setInterval(myTimer, 10);
         function myTimer() {
         allVideos[0].volume += value;
         if(allVideos[0].volume == 1){
             clearInterval(myVar);
         }
         }
           }

代码如下：

代码工作正常，我可以淡出视频。但是每次执行函数时都会出现此错误：

未捕获到的DOMException：无法在上设置'volume'属性   'HTMLMediaElement'：提供的卷（-5.30825e-16）在   范围[0，1]。       在myTimer

未捕获到的DOMException：无法在上设置'volume'属性   'HTMLMediaElement'：提供的卷（-3.08781e-16）在   范围[0，1]。       在myTimer

最后一个也继续以我的间隔运行。

Answer 1

您正在处理浮点算术近似错误。

例如，0.03 - 0.01 - 0.01 - 0.01会给您-3.469446951953614e-18。

替换

allVideos[0].volume += value;

作者

allVideos[0].volume = Math.min(1, allVideos[0].volume + value);

和

allVideos[0].volume -= value;

作者

allVideos[0].volume = Math.max(0, allVideos[0].volume - value);

提供的音量超出[0，1]错误范围

1 个答案: