我正在使用iOS节拍器网络应用程序.由于移动漫游只能播放
one sound at a time,我正在尝试创建一个“音频精灵”,我可以使用单个音轨的不同段来生成不同的声音.我有一个1秒的剪辑,其中有两个半秒钟的声音.
- <audio id="sample" src="sounds.mp3"></audio>
- <a href="javascript:play1();">Play1</a>
- <a href="javascript:play2();">Play2</a>
- <a href="javascript:pauseAudio();">Pause</a>
- <script>
- var audio = document.getElementById('click');
- function play1(){
- audio.currentTime = 0;
- audio.play();
- // This is the problem area
- audio.addEventListener('timeupdate',function (){
- if (currentTime >= 0.5) {
- audio.pause();
- }
- },false);
- }
- function play2(){
- audio.currentTime = 0.5;
- audio.play();
- }
- function pause(){
- audio.pause();
- }
- </script>
见JSFiddle.
正如你所看到的,我试图使用’timeupdate’事件(jPlayer example)无效.
我看过Remy Sharp’s post on audio sprites,但(A)我无法让它为我工作,(B)我宁愿远离图书馆依赖.
有任何想法吗?在此先感谢您的帮助!
更新
我现在使用setInterval工作:
序列和设置/清除间隔有一些问题,但为了我的目的 – 它似乎工作.
谢谢!
附:如果有人有这个修复,这可以用于游戏和界面声音FX.
解决方法
我认为这里有几个问题.
我也想
- if (currentTime >= 0.5) { ...
应该
- if (audio.currentTime >= 0.5) { ...
这也可以:
- <audio id="sample" src="http://dl.dropBox.com/u/222645/click1sec.mp3" controls preload></audio>
- <a href="javascript:playSegment(0.0,0.5);">Play1</a>
- <a href="javascript:playSegment(0.5);">Play2</a>
- <script>
- var audio = document.getElementById('sample');
- var segmentEnd;
- audio.addEventListener('timeupdate',function (){
- if (segmentEnd && audio.currentTime >= segmentEnd) {
- audio.pause();
- }
- console.log(audio.currentTime);
- },false);
- function playSegment(startTime,endTime){
- segmentEnd = endTime;
- audio.currentTime = startTime;
- audio.play();
- }
- </script>