Question

我已经通过click事件在ajax中加载了一个带子类别列表的弹出菜单。

例如：有10个主要类别，每个类别都有很多子类别列表，并在弹出窗口中加载了ajax。当我点击类别A时，它会加载类别A的子类别，当我移动到类别B时，它会加载类别B的子类别，当我回来时＆amp;再次单击类别A，请求再次转到服务器并加载相同的时间。

我需要从缓存中加载这些数据。当我再次在ajax函数中设置cache: true时，它仍会加载并发送请求。

我不需要再次向服务器请求相同的数据，即。类别A.有没有办法做到这一点？

如果由于没有互联网连接而失败，还可以重新请求服务器吗？

代码：

$.ajax({
   url:'/category/list/',
   data:'catid='+$(".category").attr('data-id'),
   cache: true,
   dataType:'json',
   beforeSend:function()
   {
    $(".subcatlist").html('<div class="loader">loading...</div>');
   }
   success:function(json){
     $(".loader").remove();
     $(".subcatlist").html(json.sublist);
   }
   error:function()
   {
     console.log('error');
   }

});

Answer 1

在接收Ajax调用的php脚本的最顶端尝试类似的东西：

header("Cache-Control: maxage=".date(DATE_RFC822,strtotime("+2 day"));
header("Pragma: private");
header("Expires: " . date(DATE_RFC822,strtotime("+2 day")));

这应告诉浏览器Ajax调用的结果可以缓存两天。

Answer 2

我在脚本文件的顶部使用它，例如： function.js / default.js / admin.js ，或<script type="text/javascript">标记之后。

$.ajaxSetup ({
    // Enable caching of AJAX responses
    cache: true
});

ajax加载后从缓存加载数据

2 个答案: