Javascript 无法在document.ready（）上缓存ajax数据

我使用以下代码从ASP.NET处理程序获取和缓存数据。问题是，每当我使用按钮缓存数据时，都会单击其正常工作，但我希望在

document.ready（）

事件中发生这种情况。当我在

document.ready（）

事件上执行此代码时，它可以完美地获取数据，但在我重新加载页面时，它无法从缓存中获取数据

var localCache = {
            data: {},
            remove: function (url) {
                delete localCache.data[url];
            },
            exist: function (url) {
                return localCache.data.hasOwnProperty(url) && localCache.data[url] !== null;
            },
            get: function (url) {
                console.log('Getting in cache for url' + url);
                return localCache.data[url];
            },
            set: function (url, cachedData, callback) {
                cacheTime = (new Date()).getTime();
                localCache.remove(url);
                localCache.data[url] = cachedData;
                if ($.isFunction(callback)) callback(cachedData);
            }
        };
        var now;
        var cacheTime;
        var tDiff;
        function getValueAtIndex(index) {
            var str = window.location.href;
            return str.split("/")[index];
        }
        //$(document).ready(function () {
        $('#Button1').click(function (e) {
            var url = '/Handlers/ResponseFetcher.ashx';
            var topicid = "<%=desid %>";
            $.ajax({
                url: url,
                type: "POST",
                data:
                    JSON.stringify({ tid: topicid })
                ,
                dataType: "json",
                cache: true,
                beforeSend: function () {
                    now = (new Date()).getTime();
                    if (localCache.exist(url)) {
                        tDiff = now - cacheTime;
                        if (tDiff < 20000) {
                            loadData(localCache.get(url));
                            return false;
                        }
                    }
                    return true;
                },
                complete: function (jqXHR, textStatus) {
                    localCache.set(url, jqXHR, loadData);
                }
            });

        });

        function loadData(data) {
            console.log("now: " + now + ", cacheTime: " + cacheTime + ", tDiff:" + (cacheTime - now));
            $('#responseloader').hide();
            var resdata = JSON.parse(data.responseText);
            $(resdata).each(function (i) {
                $('#responsecontainer').append("<div>" + this.Title + "</div>");
            });
        }

var localCache={
数据：{}，
删除：函数（url）{
删除localCache.data[url]；
},
存在：函数（url）{
返回localCache.data.hasOwnProperty（url）&&localCache.data[url]！==null；
},
获取：函数（url）{
log（'正在缓存中获取url'+url）；
返回localCache.data[url]；
},
set：函数（url、缓存数据、回调）{
cacheTime=（新日期（））.getTime（）；
localCache.remove（url）；
localCache.data[url]=cachedData；
if（$.isFunction（callback））回调（cachedData）；
}
};
var现在；
var缓存时间；
var-tDiff；
函数getValueAtIndex（索引）{
var str=window.location.href；
返回str.split（“/”）[索引]；
}
//$（文档）.ready（函数（）{
$（'#按钮1'）。单击（函数（e）{
var url='/Handlers/ResponseFetcher.ashx'；
var topicid=“”；
$.ajax({
url:url，
类型：“POST”，
数据：
stringify（{tid:topicid}）
,
数据类型：“json”，
是的，
beforeSend:函数（）{
现在=（新日期（））.getTime（）；
if（localCache.exist（url））{
tDiff=现在-缓存时间；
如果（tDiff<20000）{
loadData（localCache.get（url））；
返回false；
}
}
返回true；
},
完成：函数（jqXHR，textStatus）{
set（url、jqXHR、loadData）；
}
});
});
函数loadData（数据）{
log（“现在：+now+”，cacheTime:+cacheTime+”，tDiff:+（cacheTime-now））；
$（“#responseloader”）.hide（）；
var resdata=JSON.parse（data.responseText）；
$（resdata）。每个（函数（i）{
$（“#responsecontainer”）.append（“+this.Title+”）；
});
}

---

这里

tDiff

在第一次运行时将是

未定义的

。这是问题吗？或者如果重新加载页面，缓存不起作用？请帮助！

是什么让您认为本地缓存会在页面加载时被持久化？那么我应该如何解决这个问题？如果您想在客户端上持久化数据，那么您可能需要使用localStorage:@76484 What ab排除那些不支持HTML5？Cookies或服务器端解决方案的浏览器-也许您必须在服务器上填充localCache.data对象。