国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

Gemeinschaft

Lernen

Tools-Bibliothek

KI-Tools

Freizeit

Deutsch

javascript – Frage zum Pausieren von Audio-Tags

迷茫 2017-06-20 10:07:02

1101

<audio src="res/bg.mp3" id="m1" controls loop></audio>
    <input type="checkbox" id="bgm"/>:是否播放背景音樂
    <script>

        bgm.onchange=function(){
            if(this.checked){
                m1.volume=0;
                m1.play();
                var timer=setInterval(function(){
                    m1.volume+=0.1;
                    if(m1.volume>0.9){
                        clearInterval(timer);
                    }
                },200);
            }else{
                var timer=setInterval(function(){
                    if(m1.volume>0){
                        m1.volume-=0.1;
                    }else{
                        clearInterval(timer);
                        m1.pause();
                    }
                },200);
            }
        }
    </script>

Der Code ist wie oben. Ich m?chte eine kleine Funktion zum Anklicken des Kontrollk?stchens erstellen, um das Ein- und Ausblenden der Hintergrundmusik zu realisieren, aber beim Ausblenden m?chte ich es stoppt automatisch, wenn die Lautst?rke 0 erreicht. Aber nachdem meine Lautst?rke auf 0 ge?ndert wurde, lief der Fortschrittsbalken immer noch und m1.pause() wurde nicht wirksam. .

Ich verstehe es wirklich nicht, ich bin neu im Frontend, bitte geben Sie mir ein paar Hinweise π-π

迷茫

業(yè)精于勤，荒于嬉;行成于思，毀于隨。

Antworte allen(3)

巴扎黑2017-06-20 10:09:02 3 Etage

這個問題比較好玩，代碼的邏輯是沒問題的。

首先需要了解的是：js中浮點數(shù)的計算不精確的，比如：0.2 + 0.1結(jié)果是0.30000000000000004。

然后直接原因是報錯：Failed to set the 'volume' property on 'HTMLMediaElement': The volume provided (-1.77636e-16) is outside the range [0, 1].這是在說volume只能在[0, 1]的區(qū)間內(nèi)賦值。

漸入時，每次加 0.1，實際volume的值打印出來是：

volume每次減 0.1，實際減到最后會產(chǎn)生一個非常非常小的數(shù)，但仍大于 0：

所以仍會執(zhí)行m1.volume-=0.1導(dǎo)致volume被設(shè)置為負(fù)數(shù)報上面的錯。

解決方案已經(jīng)有同學(xué)給出了。另外可以關(guān)注下 ES6 Number.EPSILON，專門用于解決計算精度問題。

Wie +0

Antwort hinzufügen

扔個三星炸死你2017-06-20 10:09:02 2 Etage

問題出在volume的值，在HTML5規(guī)范中，volume的值是不能小于0的，但你代碼中的計算使volume的值小于0了，故腳本出錯了不再執(zhí)行。建議改成

if(m1.volume>0.1){
    m1.volume-=0.1;
}else{
    clearInterval(timer);
    m1.pause();
}

這是錯誤記錄：
Failed to set the 'volume' property on 'HTMLMediaElement': The volume provided (1.1) is outside the range [0, 1]
另外，代碼沒有通過連續(xù)點擊測試，聲音沒達(dá)到最大時再點checkbox，會出現(xiàn)bug.

Wie +0

Antwort hinzufügen

Peter_Zhu2017-06-20 10:09:02 1 Etage

改成這樣:

   var timer = null;
    bgm.onchange=function(){
        if(this.checked){
            m1.volume=0;
            m1.play();
            clearInterval(timer);
            timer=setInterval(function(){
                m1.volume+=0.1;
                if(m1.volume>0.9){
                    clearInterval(timer);
                }
            },200);
        }else{
            clearInterval(timer);
            timer=setInterval(function(){
                console.log(m1.volume)
                if(m1.volume>0){
                    // m1.volume -= 0.1;這里會有精度問題，一直減0.1不是到從1到0
                    m1.volume = m1.volume-0.1<=0?0:m1.volume-0.1;
                }else{
                    m1.pause();
                    clearInterval(timer);
                }
            },200);
        }
    }`

Wie +0

Antwort hinzufügen