2017-01-26 11 views
-1

私は、HappyBirthdayを再生する小さなJavaScriptプログラムを作りました。setIntervalを使って1を変数に追加し、特定の音符が再生または一時停止する変数の値によって異なります。 私の問題は、あるべきときにオーディオが再生されないということです。 MP3をサポートするSafariでMP3を再生できないのはなぜですか? 私のコードは:音声がサファリで再生されない理由

<!DOCTYPE HTML><html> 
<head> 
<title>happy birthday</title> 
<script> 
function setNotes(){ 
a3=document.getElementById('n1') 
a3s=document.getElementById('n2') 
b3=document.getElementById('n3') 
c4s=document.getElementById('n4') 
d4s=document.getElementById('n5') 
f4=document.getElementById('n6') 
g3=document.getElementById('n7') 
a4=document.getElementById('n9') 
b4=document.getElementById('n10') 
c5s=document.getElementById('n11') 
d5s=document.getElementById('n12') 
a5s=document.getElementById('n13') 
c4=document.getElementById('n14') 
d4=document.getElementById('n15') 
e4=document.getElementById('n16') 
f5s=document.getElementById('n17') 
g5s=document.getElementById('n18') 
a4s=document.getElementById('n19') 
c5=document.getElementById('n20') 
d5=document.getElementById('n21') 
e5=document.getElementById('n22') 
g3.play(); 
g3.pause(); 
a3.play(); 
a3.pause() 
c4.play() 
c4.pause() 
b3.play() 
b3.pause() 
d4.play() 
d4.pause() 
e4.play() 
e4.pause() 
f4.play() 
f4.pause() 

} 
function start(){ 
setInterval(music, 150) 
} 
tic=0; 
function music(){ 
if (tic==1000){tic=0}; 
if (tic==0){g3.play();} 
if (tic==3) {g3.pause();} 
if (tic==4) {g3.play()} 
if (tic==7) {g3.pause()} 
if (tic==8) {a3.play()} 
if (tic==11) {a3.pause()} 
if (tic==12) {g3.play()} 
if (tic==15) {g3.pause()} 
if (tic==16) {c4.play()} 
if (tic==19) {c4.pause()} 
if (tic==20) {b3.play()} 
if (tic==23) {b3.pause()} 
if (tic==26) {g3.play()} 
if (tic==29) {g3.pause()} 
if (tic==30) {g3.play()} 
if (tic==33) {g3.pause()} 
if (tic==34) {a3.play()} 
if (tic==37) {a3.pause()} 
if (tic==38) {g3.play()} 
if (tic==41) {g3.pause()} 
if (tic==42) {d4.play()} 
if (tic==45) {d4.pause()} 
if (tic==46) {c4.play()} 
if (tic==49) {c4.pause()} 
if (tic==52) {g3.play()} 
if (tic==55) {g3.pause()} 
if (tic==56) {g3.play()} 
if (tic==59) {g3.pause()} 
if (tic==60) {g3.play()} 
if (tic==63) {g3.pause()} 
if (tic==64) {e4.play()} 
if (tic==67) {e4.pause()} 
if (tic==68) {c4.play()} 
if (tic==71) {c4.pause()} 
if (tic==72) {b3.play()} 
if (tic==75) {b3.pause()} 
if (tic==76) {a3.play()} 
if (tic==79) {a3.pause()} 
if (tic==82) {f4.play() } 
if (tic==85) {f4.pause() } 
if (tic==86) {f4.play() } 
if (tic==89) {f4.pause() } 
if (tic==90) {e4.play()} 
if (tic==93) {e4.pause()} 
if (tic==94) {c4.play()} 
if (tic==97) {c4.pause()} 
if (tic==98) {d4.play()} 
if (tic==101) {d4.pause()} 
if (tic==102) {c4.play()} 
if (tic==105) {c4.pause()} 
++tic 
} 
</script> 
</head><body onload="setNotes();"> 
<button onclick="setTimeout(start, 3000)">play</button> 
<audio id=n1 src="http://jetcityorange.com/musical-notes/A3-220.0.mp3"></audio> 
<audio id=n2 src="http://jetcityorange.com/musical-notes/Asharp3-233.08.mp3"></audio> 
<audio id=n3 src="http://jetcityorange.com/musical-notes/B3-246.94.mp3"></audio> 
<audio id="n4" src="http://jetcityorange.com/musical-notes/Csharp4-277.18.mp3"> </audio> 
<audio id="n5" src="http://jetcityorange.com/musical-notes/Dsharp4-311.13.mp3"> </audio> 
<audio id="n6" src="http://jetcityorange.com/musical-notes/F4-349.23.mp3"> </audio> 
<audio id="n7" src="http://jetcityorange.com/musical-notes/G4-392.0.mp3"> </audio> 
<audio id="n9" src="http://jetcityorange.com/musical-notes/A4-440.0.mp3"> </audio> 
<audio id="n10" src="http://jetcityorange.com/musical-notes/B4-493.88.mp3"> </audio> 
<audio id="n11" src="http://jetcityorange.com/musical-notes/Csharp5-554.37.mp3"> </audio> 
<audio id="n12" src="http://jetcityorange.com/musical-notes/Dsharp5-622.25.mp3"> </audio> 
<audio id="n13" src="http://jetcityorange.com/musical-notes/Asharp3-233.08.mp3"> </audio> 
<audio id="n14" src="http://jetcityorange.com/musical-notes/C4-261.63.mp3"> </audio> 
<audio id="n15" src="http://jetcityorange.com/musical-notes/D4-293.66.mp3"> </audio> 
<audio id="n16" src="http://jetcityorange.com/musical-notes/E4-329.63.mp3"> </audio> 
<audio id="n17" src="http://jetcityorange.com/musical-notes/Fsharp4-369.99.mp3"> </audio> 
<audio id="n18" src="http://jetcityorange.com/musical-notes/Gsharp4-415.3.mp3"> </audio> 
<audio id="n19" src="http://jetcityorange.com/musical-notes/Asharp4-466.16.mp3"> </audio> 
<audio id="n20" src="http://jetcityorange.com/musical-notes/C5-523.25.mp3"> </audio> 
<audio id="n21" src="http://jetcityorange.com/musical-notes/D5-587.33.mp3"> </audio> 
</body> 
</html> 
+0

問題を再現するのに必要な*最小限のコードのみを表示するように質問してください。私はこれらの要素のすべてが必要であるとは信じていません。 「* [mcve] *」と「* [ask] *」のガイドラインを読んでください。 –

+0

それは私がそれを編集し、再投稿することができます私はここで答えを得ることができない場合、私はこの将来の使用のために作ったテンプレートthatsです – Utopian

答えて

0

try .oggです。一部の形式の音楽ファイルは、一部のブラウザでは動作しません。

+0

Mp3はサファリで動作します – Utopian

関連する問題