2014-08-29 52 views
0

根據以下代碼,我嘗試切換一個元素。在類似的說明中,當我點擊該元素時,它應該出現,再次點擊該元素時,它應該消失。目前,當我點擊該元素時,它會出現,但它不會在再次點擊時消失。如何切換而不是顯示

$(document).ready(function(){ 

     $('ul.nav-tabs li a').removeClass('active'); 
     $('ul.nav-tabs li a:first').addClass('active'); 
     $('.tab-content #146f632b316a42b48488b8c1da12678a, .tab-content #146f632b316a42b48488b8c1da12678a .row').show(); 
     $('ul.main-navigation li a').click(function(){ 
      var tab_id = $(this).attr('data-href'); 



      $('.mega-navigation .row').hide(); 
      $('.mega-navigation, .btnHide').show(); 
      //$('.tab-content').removeClass('current'); 
      $('ul.main-navigation li a').removeClass('active'); 
      $(this).addClass('active'); 

      //$(tab_id).addClass('current'); 
      $(tab_id).show(); 
      if(tab_id == '#tab2c8d0d2ec797404b9b1b646e797c98de'){ 
       //alert('if'); 
       $('ul.nav-tabs li a').removeClass('active'); 
       $('ul.nav-tabs li a:first').addClass('active'); 
       $('.tab-content #146f632b316a42b48488b8c1da12678a, .tab-content #146f632b316a42b48488b8c1da12678a .row').show(); 
      } 
     }) 

     $('.btnHide').click(function(){ 
      $('ul.main-navigation li a').removeClass('active'); 
      $('.mega-navigation .row, .btnHide').hide(); 
     }) 


     $('ul.nav-tabs li a').click(function(){ 
      var in_tab_id = $(this).attr('data-href'); 

      $('ul.nav-tabs li a').removeClass('active'); 
      $(this).addClass('active'); 

      $('.tab-content .tab-pane .row').hide(); 
      $('.tab-content .tab-pane').removeClass('active'); 

      $(in_tab_id).addClass('active'); 
      $(in_tab_id+','+in_tab_id+' .row').show(); 

     }) 
    }) 

回答

0

你應該張貼您的HTML太..但無論如何試試這個,而不是使用.hide()或.show()...使用此.toggle()兩種。你也可以放一個計時器。例如.toggle(400)

2
  try this 
      $('.mega-navigation .row').toggle(showOrHide); 

      if (showOrHide === true) { 
      $('.mega-navigation .row').show(); 
      } else if (showOrHide === false) { 
      $('.mega-navigation .row').hide(); 
      } 

是否有幫助?