3

JavaScript / jQuery を使用してサウンドを再生する必要があります。現在、このコードを使用してサウンドを再生しています。

var snd = new Audio('dir/file.wav');
snd.play();

私が必要としているのは、サウンドの再生が終了するまで使用できない Web ページです。おそらく、サウンドの再生中に何らかのダイアログが表示されます。サウンドが終了すると、モーダルに「OK」ボタンが表示され、ボタンを押すと、ページを使用し続けることができます。

4

5 に答える 5

3

注 : これはクロスブラウザーではありません (HTML5 互換ブラウザーのみ)。

クロス ブラウザーの互換性については、次のリンクを参照してください。 ほとんどのブラウザーのブラウザー ウィンドウで、最も信頼性が高く互換性のあるサウンド アラームを提供する方法は何ですか?


私は物事を説明するのが本当に苦手ですが、JsFiddle を作成しました。

http://jsfiddle.net/tnnjB/8/

またはここにコードがあります:

HTML :

<audio id="myaudio" onended="onAudioEnded();">
  <source src="http://www.dccl.org/Sounds/pchick-alarm.wav" type="audio/wav">
Your browser does not support the audio element.
</audio>

<input 
    type="button" 
    value="You cannot click me before the sound is over" 
    onclick="javascript:alert('congrats!')"
/>

ジャバスクリプト:

$(function(){
    var audio = document.getElementById("myaudio");
    $.blockUI({message : "Listen to the music!" });  
    audio.play();
});

function onAudioEnded(){ 
    $.unblockUI();
    alert("It's over!!");
};

私が使用したもの: jquery、jquery-ui、jquery BlockUI プラグイン、HTML5 オーディオ タグ、Google.

また、この例は IE では機能しません。IE はオーディオ ソースがリモート ホスト上にあることを受け入れないようですが、ファイルがサーバー上のローカルにある場合は機能します。

これがあなたのニーズを達成するのに役立つことを願っています,

マルク

于 2013-09-26T03:56:24.240 に答える
0

私は次のアプローチを考えました: タイマーを開始し、サウンドが再生されるまで待ちます。

Show dialog/dimmed overlay layer
setInterval()
    -> Compare snd->currentTime with snd.duration. If they are the same
        -> Clear interval
        -> Hide dialog/Show OK button

または

Show dialog/dimmed overlay layer
setInterval()
    -> Is snd.ended ?
        -> Clear interval
        -> Hide dialog/Show OK button
于 2013-09-26T03:55:33.787 に答える
0

非常にシンプル/短い解決策があります

次のコード構文を使用します。

Audio_object=document.getElementById('audio_tag_id');
if(Audio_object.currentTime==Audio_object.duration)
alert('completely played.');

audio_tag_id要素の ID です<audio>

于 2013-09-26T14:32:29.960 に答える