jQueryUI 选项卡:不同的选项卡 = 不同的 cookie?

发布于 2024-12-11 21:42:28 字数 1108 浏览 0 评论 0原文

我有两个标准 jQueryUI 选项卡,看起来几乎相同。 为了方便起见,他们添加了 cookie 选项。但现在,当我将页面从一个选项卡更改为另一个选项卡时,由于 cookie,将在另一页上选择相同的选项卡索引。

是否可以将 cookie-id 分配给选项卡功能或类似功能?

html:

<div id='tabs' class='ui-tabs'>  
  <ul class='ui-tabs-nav'>
    <li><a href='link'>Item</a></li>
    <li><a href='link'>Item</a></li>
    <li><a href='link'>Item</a></li>
    <li><a href='link'>Item</a></li>
    <li><a href='link'>Item</a></li>
  </ul>
</div>

和 jQuery:

$(function() {
  $('#tabs').tabs({
    cookie: {expires: 1}, 
    spinner: '<img src=\'img/icons/loading.gif\' />', 
    load: function (e, ui) { $(ui.panel).find('.tab-loading').remove(); }, 
    select: function (e, ui) { 
      var $panel = $(ui.panel); 
      if ($panel.is(':empty')) { 
        $panel.append('<div class=\'tab-loading\' style=\'text-align: center; font-weight: bold; width: 100%\'>Loading...</div>') 
      } 
    } 
  }) 
});

I have two standard jQueryUI tabs looking pretty much the same.
For the comfort, they have the cookie option added. But now when I change page from one tab to another, the same tab-index will be selected on the other page, because of the cookie.

Is it possible to assign a cookie-id to the tab function or anything alike?

The html:

<div id='tabs' class='ui-tabs'>  
  <ul class='ui-tabs-nav'>
    <li><a href='link'>Item</a></li>
    <li><a href='link'>Item</a></li>
    <li><a href='link'>Item</a></li>
    <li><a href='link'>Item</a></li>
    <li><a href='link'>Item</a></li>
  </ul>
</div>

And the jQuery:

$(function() {
  $('#tabs').tabs({
    cookie: {expires: 1}, 
    spinner: '<img src=\'img/icons/loading.gif\' />', 
    load: function (e, ui) { $(ui.panel).find('.tab-loading').remove(); }, 
    select: function (e, ui) { 
      var $panel = $(ui.panel); 
      if ($panel.is(':empty')) { 
        $panel.append('<div class=\'tab-loading\' style=\'text-align: center; font-weight: bold; width: 100%\'>Loading...</div>') 
      } 
    } 
  }) 
});

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

烟─花易冷 2024-12-18 21:42:28

你可以用名字来做:)

自 jQuery UI 1.7 起,还可以定义 cookie 名称
通过 name 属性使用。

$(function() {
  $('#tabs').tabs({
    cookie: {name: 'myTabCookie', expires: 1}, 
    spinner: '<img src="img/icons/loading.gif" />', 
    load: function (e, ui) { $(ui.panel).find('.tab-loading').remove(); }, 
    select: function (e, ui) { 
      var $panel = $(ui.panel); 
      if ($panel.is(':empty')) { 
        $panel.append('<div class="tab-loading" style="text-align: center; font-weight: bold; width: 100%">Loading...</div>') 
      } 
    } 
  }) 
});

You can do it with name :)

Since jQuery UI 1.7 it is also possible to define the cookie name
being used via name property.

$(function() {
  $('#tabs').tabs({
    cookie: {name: 'myTabCookie', expires: 1}, 
    spinner: '<img src="img/icons/loading.gif" />', 
    load: function (e, ui) { $(ui.panel).find('.tab-loading').remove(); }, 
    select: function (e, ui) { 
      var $panel = $(ui.panel); 
      if ($panel.is(':empty')) { 
        $panel.append('<div class="tab-loading" style="text-align: center; font-weight: bold; width: 100%">Loading...</div>') 
      } 
    } 
  }) 
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文