Jquery选项卡：打破创建 - 选择 - 重新加载循环

我有一个使用Jquery选项卡的页面。这些选项卡不仅决定了我想在选项卡内容区域显示的内容，还决定了选项卡div外部的内容。Jquery选项卡：打破创建 - 选择 - 重新加载循环

我想要的行为是，当用户选择一个选项卡时，使用url中的新参数重新加载整个页面。（我目前套结串location.href，从而迫使该页面重新加载做到这一点。

select: function(event, ui) { 
    // ... determine new_url 
    location.href = new_url; 
}

当重新加载页面，我想正确的选项卡来激活/选择，我尝试做通过检测参数的标签。

create: function(event, ui) { 
    // ... figure out which tab should be selected 
    $('.tabs').tabs('select', tab_index); 
}

我注意到，这迫使在创建的选项卡的无休止的循环中的浏览器，选择标签，重新加载，创建的选项卡，选择标签...等。有没有办法打破这个？

我知道JQuery标签不适合这种工作但帮助将不胜感激！这是我第一次尝试JQuery选项卡。

一些额外的笔记： - 我正在使用Rails的一些逻辑 - 我试图'应用状态'活跃'类到应该被选中的标签，似乎被覆盖。首先，将第一个选项卡（索引0）设置为活动状态，然后在选项卡创建功能中，选择要选择的选项卡。

<li class="tab<%= " ui-state-active" if THIS_TAB_SHOULD_BE_SELECTED %>"> 
    <a href="#tab-<%= type.downcase %>">tab 1</a> 
</li>

来源

2012-07-31 Ji Mun

你可以发布一个小提琴或演示页面与自包含的例子吗？ – fcalderan 2012-07-31 19:12:36

我不认为JSFiddle还支持JQuery 1.8。我会尝试查看是否可以创建单独的演示页面。 – 2012-07-31 19:22:42

你不能（或不应该）混合，每一个用户与那些只显示/隐藏一些内容的变化选项卡时重新加载页面的标签。我建议坚持两种方法之一。如果你想要改变页面页面，可以显示/隐藏两个标签和其他内容，或者添加新内容并替换旧的页面。或者，你可以这样做以下：
HTML：

<div class="tabs"> 
    <span class="tab-head active">Tab 1</span> 
    <div class="tab-content active">Lorem ipsum...</div> 
    <span class="tab-head">Tab 2</span> 
    <div class="tab-content">Lorem ipsum...</div> 
    <span class="tab-head">Tab 2</span> 
    <div class="tab-content">Lorem ipsum...</div> 
</div>

CSS：

.tabs {overflow: auto;} 
.tab-head {display: inline-block; float:left;} 
.tab-content {display:none;} 
.tab-content-active {display:block;}

JS：

$(".tabs .tab-head").click(function(){ 
    $(".tab-content,.tab-head",$(this).parent()).removeClass("active"); 
    $(this).addClass("active"); 
    $(this).next(".tab-content").addClass("active"); 
});

这大概是我的另一个网站做了几个月前。

编辑：我目前正在研究一种方法，通过传递URL的fragment_id一部分数据，这样的分配到每一个焊接设备的初始制表位置：page.com/path/page.php?foo=bar&baz=quux#tabs=0:1,2:6;，其中#tabs=0:1,2:6;是重要的组成部分。我有一个onload处理程序解析，以显示正确的标签形式的开始和一些JS，寻找指向具有不同标签信息的同一页面的链接。

来源

2012-07-31 19:32:17

我采取了这种方法，通过修改选项卡的类名称，而不是调用选项卡选择，它看起来像它的工作。谢谢！！ – 2012-07-31 19:57:52

Jquery选项卡：打破创建 - 选择 - 重新加载循环

回答

相关问题