2017-06-24 14 views
1

私はそれがクリックされたときmp3サウンドを再生するdivがあります。一度遊ぶ代わりに。それは何度も繰り返され続けます。コードのスニペットは次のとおりです。JQueryを使用してオーディオサウンドを1回再生するにはどうすればよいですか?

$(".g-contain").click(function() { 
     audioElement.play(); 
    }); 

これは無関係かもしれないが、私はあなたの全体的なコードを表示する必要があります図:

 /* set no cache */ 
     $.ajaxSetup({ cache: false }); 


      var audioElement = document.createElement('audio'); 
     audioElement.setAttribute('src', 'https://www.dropbox.com/s/k8xaglyd48vbnq1/pacman_chomp.mp3?dl=1'); 

     audioElement.addEventListener('ended', function() { 
      this.play(); 
     }, false); 


     $.getJSON("scripts/data", function(data) { 
     var html = []; 

     /* loop through array */ 
     $.each(data, function(index, g) { 

     $(".container").append(
      "<div class='g-details'><div class='name'>" + 
       g.name + "</div>); 

// And finally my click call is here 

$(".g-contain").click(function() { 
     audioElement.play(); 
}); 

ないmp3ファイルがg-contain div要素が

をクリックしたときに再生し続ける理由を確認しますあなたがイベント李を添付

audioElement.addEventListener('ended', function() { 
     this.play(); 
}, false); 

答えて

1

それは、このコードが原因です演奏がendedであるときにオーディオ要素にリスナーを追加してplayにします。だから一度それが(クリックで)再生されると無限に再生されます。 MDN ended event Referenceから

は:

は、メディアの終わりに達したため、再生やストリーミングが 停止したとき、またはそれ以上のデータが利用可能 ないのでエンドのイベントが発生した

を終えました。

このコードを削除してください。

+0

これは非常にうまくいった! – Jimmy

+0

すごくうれしいです。 –

関連する問題