10

<audio>HTML5の タグを使用して MP3 を再生しています。

<audio controls="controls" autoplay="autoplay">
  <source src="song.mp3" type="audio/mp3" />
</audio>

これは問題なく動作しますが、曲が自動再生を開始する前にどのように遅延を入れることができるのでしょうか? 属性がないことは知っていdelayますが、javascript で実現できると思いますか?

4

3 に答える 3

17

これを試してみてください。本当に簡単ですが、JSをマークアップの外に移動する必要があります...

<audio controls="controls" onloadeddata="var audioPlayer = this; setTimeout(function() { audioPlayer.play(); }, 8000)">
    <source src="Kalimba.mp3" type="audio/mp3" />
</audio>
于 2012-08-15T17:17:22.043 に答える
7

Javascript のみの方法:

var sound = document.createElement('audio')
sound.id = 'audio'
sound.controls = 'controls'
sound.src = 'http://a.tumblr.com/tumblr_leltkjNwWL1qf32t9o1.mp3'
sound.type = 'audio/mp3'
document.body.appendChild(sound)

function playAudio() {
  document.getElementById('audio').play();
}

setTimeout("playAudio()", 3000);

于 2012-08-15T17:02:33.613 に答える
2

これを試して：

HTML:

<div id='audio'>This will be replaced with an audio tag</div>​

jQuery: </p> 

$(document).ready(​function (){
    $("#audio").stop("true").delay('2000').queue(function() { 
      $(this).html('<audio controls="controls" autoplay="autoplay"><source src="song.mp3" type="audio/mp3" /></audio>');
    });
});​

まとめて次のようになります。

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
    </head>
    <body>
        <div id='audio'>This will be replaced with an audio tag</div>
        <script type='text/javascript'>
            $(document).ready(function (){
                $("#audio").stop("true").delay('2000').queue(function() { 
                    $(this).html('<audio controls="controls" autoplay="autoplay"><source src="song.mp3" type="audio/mp3" /></audio>');
                });
            });
        </script>
    </body>
</html>

.delay()jQueryでプロセスを遅らせるために使用できます。時間はミリ秒なので、2000 = 2 秒です。

于 2012-08-15T17:05:24.217 に答える