Question

我为我的网站创建了一个标签式布局。单击每个选项卡可转到另一页。我希望每次用户在选项卡之间切换时都避免新的HTTP post调用。我怎样才能做到这一点？解决方案必须是基于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调用

$.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
        }
    }
});

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

2 个答案: