Question

这是我的Jquery代码：

   $(".check").on("click", function(){

         if($(this).is(":visible")){
               $('#audio').remove();
               $file=$(this).html(); // "mp3FileName"
               $(this).append('<div id="audio"><audio autoplay="autoplay" src="sounds/'+$file+'.mp3"></audio></div>');
        }

    });

这完美无缺。然而，在ipad上，当用户“触摸”带有类别“check”的按钮时，该按键会触发音频，在播放音频之前大约有1到1.5秒的暂停。我想我应该预加载我的所有音频文件。但是，我没有这方面的经验。我将有大约900个大约10千字节的音频文件。

实施此操作的最佳方法是在没有这么长时间停顿的情况下触发声音？

Answer 1

Apple设备常见此错误，这对他们来说是很大的负面影响。至于这种延迟，尝试按照你的想法做你的问题，它将删除这个bug。此外，还有另一个原因，Apple iPad降低了音频/视频质量，使其可播放，这是他们的错误，今天每个音频/视频立即播放是正常的。

Answer 2

一件有用的小事：

var evt = ('ontouchstart' in window) ? 'touchstart' : 'click';
$(".check").on(evt, function(){...}

在点击事件被触发之前，大多数支持触控的设备都有半秒延迟。因此，如果不经历尝试预加载900（!!!!）音频文件的所有痛苦，只需绑定到touchstart而不是click来启用触控设备，就可以节省一些时间。< / p>

Answer 3

从Multi-Shot example

查看SoundManager2（演示4g）

如果您可以将所有900个样本放在一个音频文件中，那就是。

它可以防止多次加载和缓冲的开销，以及900个HTTP请求的开销（每个样本很容易达到1kb，总共几乎是一兆字节！）

另外请确保使用Kevin Ennis回答中描述的'ontouchstart'事件，这样可以节省300毫秒。

Answer 4

通过使用PhoneGap的Cordova Media插件并在用户有机会点击按钮之前以零音量播放文件，我解决了延迟：

function playAudio(src, preload) {

        // Create Media object from src
        my_media = new Media(src);

        // Play audio
        if (preload === true) {
            my_media.setVolume(0);
        } else {
            my_media.setVolume(1);
        }
        my_media.play();   

}

使用PhoneGap for Ipad预加载音频

4 个答案: