4

私のウェブサイトhttp://oclock.webs.comで HTML5 オーディオをループさせるのに問題があります。(これは、アラームが鳴ったときに、アラート ボックスで [OK] をクリックするまで、1 秒間のアラーム音を何度もループさせるアラームです)。

単にオーディオ タグに「ループ」を含めるだけでは、何も起こりませんでした。

StackOverflow に関する役立つ投稿を見つけて、この Web サイトにたどり着きました: http://forestmist.org/2010/04/html5-audio-loops/

方法 1 と 2 は Firefox では機能せず、Chrome ではうまくいかないため、うまくいかないことがわかっていたので、方法 3 は機能するはずでしたが、残念ながら機能しませんでした。方法 3 は、その Web サイトのページにいる場合は機能しますが、自分のページにコードが含まれている場合は機能しないため、競合するコードがある可能性があります。

私のウェブページの関連部分:

<audio id="audio1" preload>
    <source src="media/alarm.ogg" type="audio/ogg" />
    <source src="media/alarm.mp3" type="audio/mpeg" />
</audio>

<audio id="audio2" preload>
    <source src="media/alarm.ogg" type="audio/ogg" />
    <source src="media/alarm.mp3" type="audio/mpeg" />
</audio>

ページの関連 Javascript:

if(timer==true && hours==hv && mins==mv && secs==sv){
    document.getElementById("audio1").play();
    alert("o'clock: Alarm ringing!");
    document.getElementById("alarm").value="Set Alarm";

    document.getElementById('audio1').addEventListener('ended', function(){
        this.currentTime = 0;
        this.pause();
        document.getElementById('audio2').play();
    }, false);

    document.getElementById('audio2').addEventListener('ended', function(){
        this.currentTime = 0;
        this.pause();
        document.getElementById('audio1').play();
    }, false);
}

else{
    document.getElementById("audio1").pause();
    document.getElementById("audio2").pause();
    document.getElementById("audio1").currentTime = 0;
    document.getElementById("audio2").currentTime = 0;
}

目的: コンピュータの時間がページで選択された時間と一致すると、ユーザーが警告ボックスのポップアップで [OK] をクリックするまで、オーディオ アラームが繰り返されます (ループ)。

問題: 現在、オーディオは 1 回しか再生されず、ループしません。どこで台無しにしましたか？

4

1 に答える 1

0

「終了イベント」または「ループ」プロパティは、一部のブラウザでは機能しません。そこで、オーディオ再生をループするためにwindow.setInterval（）を使用しました。

この方法では、オーディオファイルの再生時間を事前に知っておく必要があります。

function playAudioWithLoop (/**HTMLAudioElement*/audio, /**Number*/length)
{
    function onEnd (){
        audio.play();
    }

    /* length is msec */
    if(length > 0) {
        audio.__timer = window.setInterval(onEnd, length);
    }
}

function stopAudioWithLoop (/**HTMLAudioElement*/audio)
{
    if(audio.__timer) {
        audio.__timer = window.clearInterval(audio.__timer);
    }
}

================================================== ====================

***playAudioWithLoop(document.getElementById("audio1"), 12*1000);***
***stopAudioWithLoop(document.getElementById("audio1"));***
于 2012-08-31T06:23:21.467 に答える