Отображать вкладку хэшированной привязки только при загрузке страницы - PullRequest
0 голосов
/ 14 июля 2011

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

<script>
//Grab hash off URL (default to first tab) and update
$(window).bind("hashchange", function(e) {
   var anchor = $(location.hash);
   if (anchor.length === 0) {
      anchor = $(".tabs div:eq(0)");
   }
   updateTabs(anchor);    
});

//Pass in the tab and show appropriate contents    
function updateTabs(tab) {    
   $(".tabs #tab a")    
      .removeClass("active")    
      .filter(function(index) {
            return $(this).attr("href") === '#' + tab.attr("id");    
      }).addClass("active");    
   $(".tabs .content").hide();    
   tab.show();       
}
//Fire the hashchange event when the page first loads    
$(window).trigger('hashchange');    
</script>

<div class="tabs">

    <ul>

        <li class="tab"><a href="#div1">Tab 1</a></li>
        <li class="tab"><a href="#div2">Tab 2</a></li>
        <li class="tab"><a href="#div3">Tab 3</a></li>

    </ul>

    <div id="div1" class="content">Div 1</div>
    <div id="div2" class="content">Div 2</div>
    <div id="div3" class="content">Div 3</div>
</div>

Ответы [ 2 ]

0 голосов
/ 25 апреля 2014

Просто скройте все элементы с помощью Jquery!

<script>
    $('.content').hide();
</script>

При этом для каждого элемента будет установлено значение «Нет», но если Javascript отключен, пользователь может использовать все.

0 голосов
/ 14 июля 2011

Почему бы не скрыть все элементы .content с помощью CSS:

<style>
    .content { display: none; }
</style>

Это предотвратит отображение браузером любого из элементов .content, прежде чем JavaScript вступит во владение.

Примечание : Если пользователь заходит на ваш сайт с отключенным JavaScript, он не увидит ни одного из элементов .content.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...