Question

我正在使用jQuery标签页面。该示例显示了在选择选项卡时如何设置cookie。但是，我想做的是使用一个按钮让用户有意识地决定选择一个特定的标签作为他/她的默认标签。

我在每个标签的内容中添加了一个按钮，其值等于标签锚值。目前，点击仅显示警报消息。

有人可以帮我关联按钮点击并将Cookie设置为标签值。我已经设置了一个jsfiddle来展示我想要完成的任务。任何帮助将不胜感激！！

    $(function() {
    $( "#tabs" ).tabs({
        select: function(event, ui) {                   
           window.location.replace(ui.tab.hash);
        },
        cookie: {
            // store cookie for a day, without, it would be a session cookie
            expires: 1
        }                        
    });
    $(".my_button").click(function() {
        alert($(this).attr("value"));
    });  
});

Answer 1

您可以直接使用$.cookie来提供自定义行为。简而言之，在创建选项卡控件（在create事件中）时，请检查是否存在cookie值。如果是，则根据值设置所选选项卡。然后点击按钮存储它：

$(function() {
    $( "#tabs" ).tabs({
        select: function(event, ui) {                   
           window.location.replace(ui.tab.hash);
        },
        create: function(e, ui) {
            var tabs = $(e.target);
            // Get the value from the cookie
            var value = $.cookie('selected-tab');

            if(value) {
                console.log('Setting value %s', value);
                // Set which tab should be selected. Older jQuery UI API
                tabs.tabs('select',value);                
            }
        },                   
    });
    $(".my_button").click(function() {
       var value = $(this).attr("value");
       console.log('Storing tab %s', value);
       // Store value with key "selected-tab" and set it to expire
       // in one day. 
       $.cookie('selected-tab', value, {expires: 1});
    });  
});

在较新版本的jQuery UI（在1.9+上验证）中，您需要使用带有选项卡索引的活动选项来选择选项卡。

示例：

  //store as value in above example or dynamically find index based on the id
  var selectedIndex = 1;

  $('#tabs').tabs('option', 'active', selectedIndex);

  // Or even better pass the active index when creating the tabs control
  $('#tabs').tabs({ active: selectedIndex });

使用按钮而不是tab设置jquery选项卡cookie

1 个答案: