如何在Ajax中缓存响应以避免http调用

Question

我已经为我的网站创建了一个选项卡式布局。点击每个标签可以进入另一个页面。每当用户在标签之间切换时，我想避免一次新的HTTP发布。我怎样才能做到这一点？解决方案必须是基于JS的解决方案。

Answer 1

1. Create div for each tab. 
2. load your ajax responce on respective div by using : 
$(<respectivedivselector>).load(<url>,<data>,<calbackfunction>(){}); 

这样你的Ajax性反应便会自动DIV缓存..

您还可以设置AJAX全局高速缓存作为

$.ajaxSetup ({ 

    cache: true 
}); 

你也可以将此属性设置为单独的AJAX调用as

$.ajax({ 
    url: "/YourURL", 
    cache: true, 
    . 
    . 
    . 
    success: function(data) { 
     $(<respectivedivselector>).html(data); 
    } 
}); 

Answer 2

您可以使用beforeLoad事件来阻止选项卡加载已经加载的内容。

$("#tabs").tabs({ 
    beforeLoad: function(event, ui) { 
     //If contents are already loaded 
     if(ui.panel.contents().length > 0){ 
      return false; //Prevent tab from loading 
     } 
    } 
});