Question

我在使用tab-panes时遇到了一个小问题。基本上我将home设置为活动，然后在另一个窗格中我有一个form来修改Home。但每次我modify/refresh页面 - 即使我使用网址.../settings#edit-home

，它也会自动返回主页

有没有办法解决这个问题？

我希望它能够保留在我刷新的任何一个窗格上，当我submit表格时，它应该重定向回同一页而不是＆＃34; home＆＃34 ;

<ul class="nav nav-pills ">

    <li role="presentation" class="active" href="#home" data-toggle="tab"><a href="#home">Home</a></li>

    <li role="presentation" href="#edit-home" data-toggle="tab"><a href="#edit-home">Modify Home</a></li>

</ul>

<div class="tab-content">

 <div class="tab-pane active " id="home">
 ...
 </div>

 <div class="tab-pane" id="edit-home">
 ...
 </div>

</div>

Answer 1

也许我的答案很晚，但它可以帮助某人。我遇到了同样的问题，这是我的解决方案：

在控制器重定向到散列网址（我有验证）：

 return redirect()
    ->to('/users/account#myphotos')
    ->withErrors($v->errors());

使用jQuery：

$(document).ready(function () {
    if (window.location.hash == '#myphotos') {
        $('li.myprofile').removeClass('active');//remove active class
        $('div#myprofile').removeClass('active');
        $('li.myphotos').addClass('active');
        $('div#myphotos').addClass('in active');
    }
});

所以只需更改类和ID名称即可。

Answer 2

您需要使用JQuery读取哈希window.location.hash并将正确的选项卡设置为活动。

所以像$('.nav-pills a[href="#'+window.location.hash+'"]').tab('show');这样的东西应该有效。您需要将其包含在if语句中，以免将选项卡设置为空白，以便：

$(document).ready(function () {
    if (window.location.hash) {
        $('.nav-pills a[href="#'+window.location.hash+'"]').tab('show');
    }
});

我从twitter bootstrap 3 setting active tab in js not working部分复制了nav-tabs，所以我希望nav-pills与twitter bootstrap具有相同的API。

Laravel - 重定向回选项卡窗格

2 个答案: