Как выделить выбранную вкладку в навигации по вкладкам - PullRequest
0 голосов
/ 19 февраля 2020

Как в этом примере я могу установить выделение выбранной вкладки?

И как я могу установить активацию первой вкладки при открытии страницы, если ни одна не установлена?

    var $tabs = $('.tabs > div'), _currhash, $currTab;
    
    function showTab() {
       if($currTab.length>0) {  
         $tabs.removeClass('active');
         $currTab.addClass('active');
       }
    }
    $tabs.each(function() {
       var _id = $(this).attr('id');
       $(this).attr('id',_id+'_tab');
    });

    function anchorWatch() {
      if(document.location.hash.length>0) {
        if(_currhash!==document.location.hash) {
           _currhash = document.location.hash;
           $currTab = $(_currhash+'_tab');
           showTab();
       }
      }
    } 
    setInterval(anchorWatch,300);
.tabs > div { display:none;}
.tabs > div.active { display:block;}

a { display:inline-block; padding:0.5em;}
.tabs > div { padding:1em; border:2px solid #ccc;}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#tab1">tab1</a>
<a href="#tab2">tab2</a>
<a href="#tab3">tab3</a>

<div class="tabs">
  <div id="tab1">content one</div>
  <div id="tab2">content two</div>
  <div id="tab3">content three</div>
</div>

Спасибо!

JSFiddle

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