Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Активация нужного таба при переходе с другой страницы (https://javascript.ru/forum/misc/51558-aktivaciya-nuzhnogo-taba-pri-perekhode-s-drugojj-stranicy.html)

vladza 11.11.2014 10:18

Активация нужного таба при переходе с другой страницы
 
Здравствуйте!

Подскажите, пожалуйста, как сделать так, чтобы имелась возможность при переходе по ссылке с одной страницы, станица с табами открывалась с активированным нужным табом?

код скрипта:
<script type="text/javascript">
// 1
function One()
{
  // Табы
  document.getElementById('OneTab').className = 'SelectedTab';
  document.getElementById('TwoTab').className = 'Tab';
document.getElementById('TreeTab').className = 'Tab';
document.getElementById('FourTab').className = 'Tab';
document.getElementById('FiveTab').className = 'Tab';
document.getElementById('SixTab').className = 'Tab';
document.getElementById('SevenTab').className = 'Tab';
document.getElementById('EightTab').className = 'Tab';
document.getElementById('Tabend').className = 'Tab';
 
  // Страницы
  document.getElementById('One').style.display = 'block';
  document.getElementById('OneTab').className = 'SelectedTab';
  document.getElementById('Two').style.display = 'none';
document.getElementById('Tree').style.display = 'none';
document.getElementById('Four').style.display = 'none';
document.getElementById('Five').style.display = 'none';
document.getElementById('Six').style.display = 'none';
document.getElementById('Seven').style.display = 'none';
document.getElementById('Eight').style.display = 'none';
document.getElementById('end').style.display = 'none';
document.getElementById('block11').style.display = 'block'; 
 
}
// 2
function Two()
{
  // Табы
 document.getElementById('TwoTab').className = 'SelectedTab';
  document.getElementById('OneTab').className = 'Tab';
  document.getElementById('TreeTab').className = 'Tab';
document.getElementById('FourTab').className = 'Tab';
document.getElementById('FiveTab').className = 'Tab';
document.getElementById('SixTab').className = 'Tab';
document.getElementById('SevenTab').className = 'Tab';
document.getElementById('EightTab').className = 'Tab';
document.getElementById('Tabend').className = 'Tab';
 
  // Страницы
document.getElementById('TwoTab').className = 'SelectedTab';
 document.getElementById('Two').style.display = 'block';
  document.getElementById('One').style.display = 'none';
 document.getElementById('Tree').style.display = 'none';
 document.getElementById('Four').style.display = 'none';
document.getElementById('Five').style.display = 'none';
document.getElementById('Six').style.display = 'none';
document.getElementById('Seven').style.display = 'none';
document.getElementById('Eight').style.display = 'none';
document.getElementById('end').style.display = 'none'; 
document.getElementById('block11').style.display = 'block';  
}
 
// 3
function Tree()
{
  // Табы
  document.getElementById('OneTab').className = 'Tab';
document.getElementById('TwoTab').className = 'Tab';
  document.getElementById('TreeTab').className = 'SelectedTab';
document.getElementById('FourTab').className = 'Tab';
document.getElementById('FiveTab').className = 'Tab';
document.getElementById('SixTab').className = 'Tab';
document.getElementById('SevenTab').className = 'Tab';
document.getElementById('EightTab').className = 'Tab';
document.getElementById('Tabend').className = 'Tab';
 
  // Страницы
document.getElementById('TreeTab').className = 'SelectedTab';  
document.getElementById('One').style.display = 'none';
document.getElementById('Two').style.display = 'none';
  document.getElementById('Tree').style.display = 'block';
 document.getElementById('Four').style.display = 'none';
document.getElementById('Five').style.display = 'none';
document.getElementById('Six').style.display = 'none';
document.getElementById('Seven').style.display = 'none';
document.getElementById('Eight').style.display = 'none';
document.getElementById('end').style.display = 'none';
document.getElementById('block11').style.display = 'block';  
}
 
</script>


код табов:
<div class="menuObject">
 
<ul id="Tabs"> 
 
 
 
 
            <li id="TwoTab" class="Tab"><a href="#Two" onclick="Two(); return false;">1</a></li>
                <li id="OneTab" class="Tab"><a href="#One" onclick="One(); return false;">2</a></li>
                <li id="TreeTab" class="SelectedTab"><a href="#Tree" onclick="Tree(); return false;">3</a></li>
    <li id="FourTab" class="Tab">               
            </ul></div>


огромное спасибо заранее.

ksa 11.11.2014 10:41

Цитата:

Сообщение от vladza
как сделать так, чтобы имелась возможность при переходе по ссылке с одной страницы, станица с табами открывалась с активированным нужным табом?

Например передавать в УРЛ ссылки ИД нужного таба... По готовности документа смотреть УРЛ и активировать соответствующий таб...

vladza 11.11.2014 10:43

Цитата:

Сообщение от ksa (Сообщение 340365)
Например передавать в УРЛ ссылки ИД нужного таба... По готовности документа смотреть УРЛ и активировать соответствующий таб...

вся проблема в том, как это реализовать. я, к сожалению, не допираю :-(

ksa 11.11.2014 10:45

Цитата:

Сообщение от vladza
вся проблема в том, как это реализовать

Ссылки делать вида

<a href='<базовый_url>?idTab=<ИД_таба>'>ссылка</a>


Потом смотреть это
http://javascript.ru/window-location

Читать нужный параметр... Активировать соответствующий таб...

ksa 11.11.2014 10:48

vladza, серверный язык какой-то есть? Тогда будет еще проще... На сгенеренной странице можно будет сразу активировать нужный таб, прочитав параметр из реквеста...


Часовой пояс GMT +3, время: 07:40.