Javascript 是否存在可以缓存的最大图像数？

我的服务器上有700个352x288大小9kbs的帧/图像。我想把它们渲染成浏览器上的视频剪辑。我正在使用JQueryAjax获取这些图像并返回一个

0）数组{
div.removeChild（缓存[_索引-1]）；
}               
div.appendChild（缓存[_索引]）；
}
否则{
间隔=0；
}
_索引++；
如果（_索引==_总计）
{
div.removeChild（缓存[_索引-1]）；
_指数=0；
div.appendChild（缓存[_索引]）；
}
}

代码隐藏：

<script type="text/javascript">
    var cache = [];
    var cacheImage = document.createElement('img');
    var interval = 100;
    var _total = 0;

    $("#btnPlay").click(function () {
        $.ajax({
            type: "POST",
            url: "Default3.aspx/GetClips",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                cache = [];
                 _total = 0;
                $.each(msg.d, function () {
                    var cacheImage = document.createElement('img');
                    cacheImage.src = this['Text'];
                    cache[_total] = cacheImage;
                    _total++;
                }
                );
                setInterval('swapImages()', interval);
            },
            error: function (msg) {
                alert(msg.d);
            }
        });
    });
    var div = document.getElementById('divImage');
    var _index = 0;
    function swapImages() {

        if (_index < _total) {              
            if (_index > 0) {
                div.removeChild(cache[_index - 1]);
            }               
            div.appendChild(cache[_index]);
        }
        else {
            interval = 0;
        }
        _index++;
        if (_index  == _total)
        {
            div.removeChild(cache[_index - 1]);
            _index = 0;
            div.appendChild(cache[_index]);
        }
    }

[WebMethod]
公共静态ArrayList GetClips（）
{
ArrayList_arr=新的ArrayList（）；
int _max=250；//似乎很安全
string[]_files=Directory.GetFiles（@“C:\Cloud\cataloges\000EC902F17F\2\2013\10\6\10\f1fe61da-4684-48ed-a503-4a5586ece9c8”，“*.jpg”）；//731
对于（int\u index=0；\u index<\u files.Length；\u index++）
{
字符串_file=_files[_index]；
字符串[]\u位=\u文件.Split（'\\'）；
字符串_url=“Portal/cataloges/000EC902F17F/2/2013/10/6/10/f1fe61da-4684-48ed-a503-4a5586ece9c8/”+_位[10]；
ListItem _item=新建ListItem（）；
_item.Text=\uURL；
_arr.Add（_项）；
如果（_索引==_最大值-1）
{
打破
}
}
返回_arr；
}

问题是，您并没有真正预取实际的图像数据；您只是获取URL。浏览器仍然需要发出单独的HTTP请求来获取每个图像的实际图像位。@Pointy您好，谢谢您的回复。我以为我在缓存jquery，我有这样一个：var cacheImage=document.createElement（'img'）；cacheImage.src=此['Text']；cache[_total]=cacheImage；缓存[_total]保存图像控制的地方……嗯，是的，我想我的意思是仍然有很多单独的图像HTTP事务。我不能说我对你如何或为什么会犯这些错误有任何线索，但我真的怀疑这是客户端的问题。对于这样的小图像，“胖”客户端（计算机，而不是电话）应该能够轻松缓存数百个。@Pointy嗨，我也会这么想。另外，我刚刚在IE9上运行了代码，我得到了闪烁，所以我现在有点困在两件事上。我确实尝试过精灵，但记忆只是跳跃，从未下降，所以我无法使用它..：(

<script type="text/javascript">
    var cache = [];
    var cacheImage = document.createElement('img');
    var interval = 100;
    var _total = 0;

    $("#btnPlay").click(function () {
        $.ajax({
            type: "POST",
            url: "Default3.aspx/GetClips",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                cache = [];
                 _total = 0;
                $.each(msg.d, function () {
                    var cacheImage = document.createElement('img');
                    cacheImage.src = this['Text'];
                    cache[_total] = cacheImage;
                    _total++;
                }
                );
                setInterval('swapImages()', interval);
            },
            error: function (msg) {
                alert(msg.d);
            }
        });
    });
    var div = document.getElementById('divImage');
    var _index = 0;
    function swapImages() {

        if (_index < _total) {              
            if (_index > 0) {
                div.removeChild(cache[_index - 1]);
            }               
            div.appendChild(cache[_index]);
        }
        else {
            interval = 0;
        }
        _index++;
        if (_index  == _total)
        {
            div.removeChild(cache[_index - 1]);
            _index = 0;
            div.appendChild(cache[_index]);
        }
    }

[WebMethod]
public static ArrayList GetClips()
{
    ArrayList _arr = new ArrayList();
    int _max = 250;  //seems to be safe
    string[] _files = Directory.GetFiles(@"C:\Cloud\Catalogues\000EC902F17F\2\2013\10\6\10\f1fe61da-4684-48ed-a503-4a5586ece9c8","*.jpg"); //731
       for (int _index = 0; _index < _files.Length; _index++)
    {
        string _file = _files[_index];
        string[] _bits = _file.Split('\\');
        string _url = "Portal/Catalogues/000EC902F17F/2/2013/10/6/10/f1fe61da-4684-48ed-a503-4a5586ece9c8/" + _bits[10];
        ListItem _item = new ListItem();
        _item.Text = _url;
        _arr.Add(_item);
        if (_index == _max - 1)
        {
            break;
        }
    }
    return _arr;
}