【iOS】iPhoneのsafariで音を出す方法

やま104

2012年12月11日 06:01

html5で導入されたaudioタグを利用すると、iPhoneのsafariから音が出せるっぽい。
しかーし、これが曲者で。
クリックイベントなどのトリガーからは再生しようとすると音が出るのだが。
onloadなどのイベントからは音が出ない。

そんなときの、ちょっとした回避策のメモ
クリックイベントでaudioを一度loadすると、音が出る。
以下、サンプル。
画面を開いたときは音は鳴らないけど。
ボタンをクリックすると、以降、音が鳴ります。

<html>
<head>
</head>
<body onload="init()">
<span id="m"></span>
<audio id="audio1"><source src="a.m4a"></audio>
<input type="button" >

<script language="javascript">
var a, c=0;
function init() {
 a = document.getElementById('audio1');
 setTimeout('loop()', 1000);
}
function loop() {
 c++;
 document.getElementById("m").innerText = c;
 a.play();
 setTimeout('loop()', 1000);
}
function load() {
 a.load();
}
</script>
</body>
</html>


関連記事