0

背景：我有一个网站根据搜索条件一次加载音频文件（1-50 个）。用户可以随时调整搜索以查看数千个音频文件的库。页面不会刷新，但会通过 AJAX 提供结果。我不能将音频标签设置为 preload="auto" 因为如果同时加载 50 个音轨，并且搜索不断变化并且搜索的人超过一个，那么浏览器将崩溃。这没什么大不了的，因为有一个解决方案。该解决方案虽然不是 100% 防弹的，如果以正确的方式完成，可能会导致音频文件的加载完全不会发生。

代码：要开始在 mouseenter 上加载音频文件，我这样做：

$("#mainSelector").on('mouseenter', '.classOfAudioFiles', function() {
            变种音频，
                剥离ID，
                $last_played = $('#last_played').val();
            strippedId = this.id.substring(15);
            音频 = $('#audio_'+strippedId).get(0);
            if($last_played != 'audio_'+strippedId){
                console.log('over');
                音频.play();
                音频.暂停（）；
                audio.addEventListener("canplaythrough", function(){
                    console.log('准备好了');
                    }
                );
            }
        });

要通过单击按钮播放音频文件，而不是播放按钮，我这样做：

$("#mainSelector").on('click', '.classOfAudioFiles, .classOfAudioFiles2', function(event) {
            //停止所有播放音频
            $.each($('audio'), function () {
                this.pause();
            });
            //变量
            变种音频，
                $last_played = $('#last_played'),
                alreadyPlaying = $('#' + $last_played.val()).get(0),
                $hideLastOpened = $last_played.val().substring(6),
                停止所有动作，
                点击TrackId；
            if(this.id.substring(0,15) == 'classOfAudioFiles2'){
                clickTrackId = this.id.substring(16);
                console.log('title');
            }别的{
                clickTrackId = this.id
                console.log('按钮');
            }


            if($('#last_played').val() != 'audio_'+clickingTrackId){
                //alert($last_played+' --- audio_'+clickingTrackId);
                //隐藏上次打开的
                $('#playTrack'+$hideLastOpened).hide();
                //显示加号
                $('#closePlus'+$hideLastOpened).show();
                //已经播放 = 0;
            }
            //设置最后播放
            $last_played.val('audio_'+clickingTrackId);
            //创建音频
            音频 = $('#audio_'+clickingTrackId).get(0);
            audio.addEventListener("canplaythrough", function(){
                console.log('ready2');
                }
            );

            if($hideLastOpened == $('#last_played').val().substring(6)){
                $('#last_played').val('audio_1000');
                停止所有动作 = 1；
            }别的{
                停止所有动作 = 0；
            }


            if (alreadyPlaying != undefined && stopAllActions == 1){
                已经播放.pause();

            }别的{
                //延迟播放
                设置超时（函数（）{
                    音频.play();

                }, 250);
            }
        });

问题：在上述任何一个代码中，我是否遗漏了什么可以确保音频文件在 100% 的时间内播放（延迟略有帮助，但不是 100%）？这更像是服务器问题吗，例如内存？还是它依赖于客户端，因此服务器调整不会做任何事情？

4

0 回答 0