Как получить цифру из href кнопки таба, к которому относится контейнер таба?

188

11 октября 2018, 00:00

<div id="tabs"> 
  <li href="#tab-1">tab1</li> 
  <li href="#tab-2">tab2</li> 
  <li href="#tab-3">tab3</li> 
</div> 
<div class="content"> 
  <div id="tab-1" class="tab-content"><button>получить цифру из href таба(1)</button></div> 
  <div id="tab-2" class="tab-content"><button>получить цифру из href таба(2)</button></div> 
  <div id="tab-3" class="tab-content"><button>получить цифру из href таба(3)</button></div> 
</div> 
<!-- как получить цифру из href кнопки таба, к которому относится контейнер таба? -->

Можно ли как-то средствами js или jquery получить это число? При чем для каждой кнопки, потому как они лежат каждая в своем контейнере таба, получить нужное число из атрибута href кнопки таба.

Answer 1

(function(){ 
  $(function(){ 
    $('button', '.content').click(function(){ 
      var href = '#' + $(this).parent().attr('id') 
      var n = $('[href=' + href + ']').attr('href').replace('#tab-','') 
      console.log(n) 
    }) 
  }) 
})()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div id="tabs"> 
  <li href="#tab-1">tab1</li> 
  <li href="#tab-2">tab2</li> 
  <li href="#tab-3">tab3</li> 
</div> 
<div class="content"> 
  <div id="tab-1" class="tab-content"><button>получить цифру из href таба(1)</button></div> 
  <div id="tab-2" class="tab-content"><button>получить цифру из href таба(2)</button></div> 
  <div id="tab-3" class="tab-content"><button>получить цифру из href таба(3)</button></div> 
</div> 
<!-- как получить цифру из href кнопки таба, к которому относится контейнер таба? -->