2015-10-15 19 views
0

Этот код работает правильно при первом щелчке. Когда повторяется его работы только при втором нажатии на один и тот же элемент. HTMLНажмите «Действия» для второго щелчка

<div id="monthly-table"> 
<a href="#" class="monthly active">Monthly</a> 
<a href="#" onclick="subscriptionTable(this)" class="yearly">Yearly</a> 
<h1>Monthly</h1></div><div id="yearly-table" style="display:none"> 
<a href="#" onclick="subscriptionTable(this)" class="monthly">Monthly</a> 
<a href="#" class="yearly active">Yearly</a> 
<h1>Yearly</h1></div> 

SCRIPT

function subscriptionTable(el) { 
    $(el).on('click', function() { 
     if ($('#yearly-table').is(':hidden')) { 
      $('#yearly-table').show(); 
      $('#monthly-table').hide(); 
     } else { 
     $('#yearly-table').hide(); 
     $('#monthly-table').show(); 
     } 
     return false; 
    }); 
}; 
+0

почему не так http: // http: //jsfiddle.net/eLj3v64g/ – guradio

ответ

0

Вместо того, чтобы использовать обработчик рядный щелчок, чтобы зарегистрировать обработчик JQuery нажмите, использовать JQuery DOM готова обработчик зарегистрировать обработчик щелчка

jQuery(function($) { 
 
    $('.period').on('click', function() { 
 
    var $target = $($(this).attr('href')).show(); 
 
    $('.target').not($target).hide(); 
 
    return false; 
 
    }); 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="monthly-table" class="target"> 
 
    <a href="#" class="monthly active">Monthly</a> 
 
    <a href="#yearly-table" class="yearly period">Yearly</a> 
 
    <h1>Monthly</h1> 
 
</div> 
 
<div id="yearly-table" class="target" style="display:none"> 
 
    <a href="#monthly-table" class="monthly period">Monthly</a> 
 
    <a href="#" class="yearly active">Yearly</a> 
 
    <h1>Yearly</h1> 
 
</div>

+0

http://jsfiddle.net/arunpjohny/xf135v5o/ –

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