缓存JQuery UI-Tabs Ajax加载内容？

我使用JQuery UI Tabs。我所做的是按照以下建议使用Ajax加载每个选项卡的内容：http://jqueryui.com/tabs/#ajax 缓存JQuery UI-Tabs Ajax加载内容？

问题：如果用户单击Tab A，然后再单击Tab B，然后再单击Tab A，则将双击Tab A的内容。

是否可以缓存JQuery UI选项卡的内容？

2013-10-31 confile

什么是你正在使用的精确AJAX代码？除非您在客户端脚本中保存选项卡的内容，否则无论何时切换AJAX请求将始终激活。没有看到确切的代码，很难判断AJAX请求是否被正确缓存。对于具有相同URL的'GET'，应该可以使用 – thatidiotguy

。 –

尝试使用beforeLoad事件：

$(".selector").tabs({ 
    beforeLoad: function(event, ui) { 
     // if the target panel is empty, return true 
     return ui.panel.html() == ""; 
    } 
});

beforeLoad（事件，UI）

当远程标签即将被加载触发， beforeActivate后事件。可以取消防止从加载内容的标签面板;尽管面板仍将被激活。此事件在Ajax请求发生之前触发，因此可以对ui.jqXHR和ui.ajaxSettings进行修改。

注意：虽然提供了ui.ajaxSettings并且可以修改，但这些设置的一些已经由jQuery处理。例如，预过滤器已应用，数据已处理，且类型已确定。 beforeLoad事件同时发生，因此与从 jQuery.ajax（）的beforeSend回调具有相同的限制。

来源

2013-10-31 16:46:43 hunter

它工作的很好，但你必须使用jquery-ui 1.9以上版本 – confile

有人可以解释为什么这实际上有效吗？它当然可以，但我不确定为什么在变量为空时返回true会有诀窍 - 它为什么不阻止第一次加载呢？ –

返回'true'表示标签内容尚未加载并继续。返回'false'意味着它显示标签内容但不会尝试加载内容 – hunter

我以前也碰到过这样的。

将时间戳添加到服务器端url。这样每次重新加载页面并联系服务器时，都会有一个新的时间戳记。但是当你在客户端点击时，IE不会重新加载url，因为它是相同的，只有页面上的更改重新加载/导航离开和返回。

PHP：

$time = time(); 
$tabs = "<div id='tabs'> 
<ul> 
<li><a href='Home.php?viewIsActive=true&tab=true&timeStamp=" . $time . "'> Active </a></li> 
<li><a href='Home.php?listAll=true&tab=true&timeStamp=" . $time . "'> List All </a> </li> 
</ul> 
</div>"

所以，你只需要加载每个页面刷新/导航，使用服务器端的时间戳一次Ajax请求。

来源

2013-10-31 17:34:45 TigerBear

$(function() { 
    $("#tabs").tabs({ 
     beforeLoad: function (event, ui) { 
      if (ui.tab.data("loaded")) { 
       event.preventDefault(); 
       return; 
      } 
      //ui.ajaxSettings.cache = false, 
      ui.panel.html('<img src="images/loader.gif" width="24" height="24" style="vertical-align:middle;"> Loading...'), 
      ui.jqXHR.success(function() { 
       ui.tab.data("loaded", true); 
      }), 
      ui.jqXHR.error(function() { 
       ui.panel.html(
       "Please Reload Page or Try Again Later."); 
      }); 
     } 
    }); 
});

来源

2017-03-27 11:59:48

缓存JQuery UI-Tabs Ajax加载内容？

回答

相关问题