自动播放音频和使用JQuery

问题描述：

下面只播放一次是音频播放器的样品：自动播放音频和使用JQuery

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>audio.js</title> 
    <script src="./audiojs/audio.min.js"></script> 
    <link rel="stylesheet" href="./includes/index.css" media="screen"> 
    <script> 
     audiojs.events.ready(function() { 
     audiojs.createAll(); 
     }); 
    </script> 
    </head> 
    <body> 
    <header> 
     <h1>audio.js</h1> 
    </header> 

    <audio src="http://kolber.github.io/audiojs/demos/mp3/juicy.mp3" preload="auto"></audio> 


    </body> 
</html>

有了这个，我想添加一些约束等不希望显示播放button.Instead它将自动10秒后进行游戏，只能玩一次。我该怎么办。如果有人知道解决方案，请帮我解决这个问题。参考。 https://kolber.github.io/audiojs/

答

您可以通过改变它的.play-pause风格display:none

设置autoplay到false，以避免在播放负荷和使用setTimeout 10秒后打隐藏播放/暂停按钮。

请参阅下面的代码

<!DOCTYPE html> 
<html lang="en"> 

<head> 
    <meta charset="utf-8"> 
    <title>audio.js</title> 
    <script src="./audiojs/audio.min.js"></script> 
    <link rel="stylesheet" href="./includes/index.css" media="screen"> 
    <style> 
     .play-pause { 
      display: none; 
     } 

     .scrubber { 
      display: none; 
     } 

     .audiojs { 
      width: 110px; 
     } 

     .audiojs .time { 
      border-left: none; 
     } 
    </style> 
</head> 

<body> 
    <header> 
     <h1>audio.js</h1> 
    </header> 

    <audio src="http://kolber.github.io/audiojs/demos/mp3/juicy.mp3" id="player"></audio> 
    <label id="audio_stats"></label> 
    <script> 
     var element = document.getElementById("player"); 
     var settings = { 
      autoplay: false, 
      loop: false, 
      preload: true, 
      swfLocation: 'audiojs/audiojs.swf', 
      trackEnded: function (e) { 
       document.getElementById("audio_stats").innerText = "Track Ended..."; 
      } 
     } 

     audiojs.events.ready(function() { 
      var a = audiojs.create(element, settings); 
      var count = 11; 
      var counter = setInterval(timer, 1000); 

      function timer() { 
       count = count - 1; 
       if (count <= 0) { 
        clearInterval(counter); 
        a.play(); 
        document.getElementById("audio_stats").innerText = "Playing..."; 
        return; 
       } 
       document.getElementById("audio_stats").innerText = "Will Start in " + count + " sec."; 
      } 
     }); 
    </script> 
</body> 
</html>

我要添加文本之上，如音频“音频将在10秒开始，9秒计时器一样会出现”音频完成后同样会显示文本completed.And它只能播放一次 –

此外用户无法转发或倒退音频 –

@KavyaShree检查更新的答案 –

自动播放音频和使用JQuery

相关推荐