Как связаться с другой страницей на вкладках?

У меня проблемы с загрузочными вкладками на моей странице php. Я использую две вкладки, как это на index.phpКак связаться с другой страницей на вкладках?

<ul class="nav nav-tabs" id="myTab"> 
    <li class="active"> <a data-toggle="tab" href="#s1"><span class="hidden-mobile hidden-tablet">FIRST TAB</span></a> </li> 
    <li> <a data-toggle="tab" href="#s2"><span class="hidden-mobile hidden-tablet">SECOND TAB</span></a> </li> 
</ul>

И вкладка Содержание, как этот

<div class="tab-pane fade" id="s1">Tabe 1 content 
    <ul> 
     <li>s1_link_A</li> 
     <li>s1_link_B</li> 
    </ul> 
</div> 
<div class="tab-pane fade" id="s2">Tabe 2 content 
    <ul> 
     <li>s2_link_A</li> 
     <li>s2_link_B</li> 
    </ul> 
</div>

Мой Первая проблема является:

Теперь я хочу, что когда пользователь клик на <li>s1_link_A</li> ИЛИ <li>s2_link_A</li>, тогда первая вкладка должна быть активной и показывать содержимое. точно так же, когда мы нажимаем на FIRST TAB.

Аналогично, когда пользователь звонит на <li>s1_link_B</li> ИЛИ <li>s2_link_B</li>, тогда вторая вкладка должна быть активной и показывать содержимое. точно так же, когда мы нажимаем на SECOND TAB.

Мой Вторая проблема является:

Я хочу открыть оба ТАБУЛЯЦИИ из другой страницы index_2.php используя ссылку, как

<ul> 
    <li><a href=""><u>Link to be First Tab</u></a></li> 
    <li><a href=""><u>Link to be Second Tab</u></a></li> 
</ul>

Когда пользователь нажимает на Link First Tab, то он должен быть идти в index.php и FIRST TAB должны быть активны. То же самое, когда пользователь нажимает на Link Second Tab, тогда он должен перейти в index.php и SECOND TAB.

Пожалуйста, помогите решить две проблемы!

Спасибо.

источник

2014-12-11 Ansha

вы пробовали добавлять '' 'внутри литий '? –

для второй проблемы; передать хэш-тег в url, использовать javascript для получения хэш-тега и сравнить его с вкладками и сделать его активным –

Я использовал его . Но его работа только один раз. когда мы conitnue на index.php (realte до первой проблемы), он не работает. – Ansha

Я находка решение первой задачи просто добавить

<script> 
$("a[data-tab-destination]").on('click', function() { 
    var tab = $(this).attr('data-tab-destination'); 
    $("#"+tab).click(); 
}); 
</script>

и редактировать

<ul class="nav nav-tabs" id="myTab"> 
    <li class="active"> <a data-toggle="tab" href="#s1" id="tab-1"><span class="hidden-mobile hidden-  tablet">FIRST TAB</span></a> </li> 
    <li> <a data-toggle="tab" href="#s2" id="tab-1"><span class="hidden-mobile hidden-tablet">SECOND TAB</span></a> </li> 
</ul> 


<!------------AND------------------> 

<div class="tab-pane fade" id="s1">Tabe 1 content 
<ul> 
    <li>s1_link_A</li> 
    <li><a data-tab-destination="tab-2" >s1_link_B</a></li> 
</ul> 
</div> 
<div class="tab-pane fade" id="s2">Tabe 2 content 
<ul> 
    <li><a data-tab-destination="tab-1" >s2_link_A</a></li> 
    <li>s2_link_B</li> 
</ul> 
</div>

решения для второй задачи

просто добавить в inddex.php

<script> 
var url = document.location.toString(); 
if (url.match('#')) { 
$('.nav-tabs a[href=#'+url.split('#')[1]+']').tab('show') ; 
} 

// Change hash for page-reload 
$('.nav-tabs a').on('shown', function (e) { 
window.location.hash = e.target.hash; 
}) 
</script>

И редактировать в index_2.php

<ul> 
    <li><a href="index.php#s1"><u>Link to be First Tab</u></a></li> 
    <li><a href="index.php#s2"><u>Link to be Second Tab</u></a></li> 
</ul>

DONE

источник

2014-12-12 07:05:32 Ansha

Как связаться с другой страницей на вкладках?

ответ

Смежные вопросы