JSのオーディオライブラリをロードする

オーディオの長さを再生してから、一時停止してからオーディオの長さ/長さを取得するためにもう一度再生する必要はありませんか？JSのオーディオライブラリをロードする

呼び出される関数は次のようになります。this.createRangeElement

しかし、いくつかの理由では、「NaNを」を出力するので、どのように私はレンダリングするためにオーディオを強制するのでしょうか？

function get_uai(){ return new uai(); } 
 
function uai(){ 
 
    var AE = new Audio(); 
 
    var played = false; 
 

 
    this.src = ""; 
 
    this.set_src = function(){ AE.src = this.src; AE.load(); } 
 

 

 
    this.play = function(){ 
 
    if(played == true){ 
 
     AE.play(); 
 
    }else{ 
 
     AE.src = this.src; 
 
     played = true; 
 
     AE.play(); 
 
    } 
 
    }; 
 

 
    this.pause = function(){ 
 
    AE.pause(); 
 
    } 
 

 
    this.stop = function(){ 
 
    window.aui = undefined; 
 
    } 
 

 

 
    this.createRangeElement = function(){ 
 
    var min = "0"; 
 
    AE.load(); 
 
    var max = AE.duration; 
 
    console.log(max); 
 
    } 
 

 
} 
 

 

 
// Getting the UAI API 
 
     var aud = get_uai(); 
 

 
     // Setting the source 
 
     aud.src = "http://crossorigin.me/https://s3-us-west-2.amazonaws.com/s.cdpn.io/1715/the_xx_-_intro.mp3"; 
 
     aud.set_src(); 
 

 
     // Creating a range element 
 
     aud.createRangeElement(); 
 

 
     // Playing the sound 
 
     //aud.play()

<html> 
 
    <head> 
 
    <title>Music Player</title> 
 
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" /> 
 
    </head> 
 
    <body> 
 
    <em class="fa fa-pause" onclick="aud.pause();"></em> 
 
    <em class="fa fa-play" onclick="aud.play();"></em> 
 
    </body> 
 
</html>

出典

2016-11-11 Anonymous

EDIT：一時停止と再生ボタンが機能するようになりました –

あなたはオーディオデュレーションデータが利用可能であるかどうかを検出するためにoncanplaythroughイベントを使用することができます。

function get_uai() { 
 
    return new uai(); 
 
} 
 

 
function uai() { 
 
    var AE = new Audio(); 
 
    var played = false; 
 

 
    this.src = ""; 
 
    this.set_src = function() { 
 
     AE.src = this.src; 
 
     AE.load(); 
 
    } 
 

 
    this.play = function() { 
 
     if (played == true) { 
 
      AE.play(); 
 
     } else { 
 
      AE.src = this.src; 
 
      played = true; 
 
      AE.play(); 
 
     } 
 
    }; 
 

 
    this.pause = function() { 
 
     AE.pause(); 
 
    } 
 

 
    this.stop = function() { 
 
     window.aui = undefined; 
 
    } 
 

 

 
    this.createRangeElement = function() { 
 
     var min = "0"; 
 
     AE.load(); 
 
     AE.oncanplaythrough = function() { 
 
      var max = AE.duration; 
 
      console.log(max); 
 
     } 
 
    } 
 

 
} 
 

 
var aud = get_uai(); 
 
aud.src = "http://crossorigin.me/https://s3-us-west-2.amazonaws.com/s.cdpn.io/1715/the_xx_-_intro.mp3"; 
 
aud.set_src(); 
 
aud.createRangeElement();

<html> 
 
    <head> 
 
    <title>Music Player</title> 
 
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" /> 
 
    </head> 
 
    <body> 
 
    <em class="fa fa-pause" onclick="aud.pause();"></em> 
 
    <em class="fa fa-play" onclick="aud.play();"></em> 
 
    </body> 
 
</html>

出典

2016-11-15 07:37:37

JSのオーディオライブラリをロードする

答えて

関連する問題