Jquery Вкладки сбросить вкладки после нажатия кнопки внутри Tab

Question

При нажатии на кнопку внутри вкладки, вкладка загрузки и он возвращается к первой вкладке .. эта картина будет делать вещи ясно:

Например, если я нажал на REDSEA, выбранная вкладка ASIA изменится и вернется к первому AFRICA, мне нужно, когда я нажимаю кнопку REDSEA на вкладке, выбранную ASIA!

Это код, который Im помощью:

<script> 
     $(function() { 
      $("#tabs").tabs(); 
     }); 
    </script> 
<div id="tabs"> 
    <ul> 
    <li><a href="#tabs-1">AFRICA</a></li> 
    <li><a href="#tabs-2">EUROPE</a></li> 
    <li><a href="#tabs-3">AMERICA</a></li> 
    <li><a href="#tabs-4">ASIA</a></li> 
    <li><a href="#tabs-5">OTHER TRADE</a></li> 
    </ul> 
    <div id="tabs-1"> 

    <asp:Button id="tr" OnClick="trd_clk1" runat="server" text='<%# Bind("trade") %>' UseSubmitBehavior="False" CommandName="tr" Width="105px" Height="22" CommandArgument='<%# Bind("trade") %>' CssClass="btn" />&nbsp;&nbsp;&nbsp; 

    </div> 
    'The same thing for other tabs 
</div> 

Answer 1

Попробуйте установить изменения хэш URL при смене вкладки и сохранить хэш постбэка

<script> 
     $(function() { 
      $("#tabs").tabs(); 
      // set hash on tab change 
      $('#tabs ul li a').click(function() { 
       location.hash = $(this).attr('href'); 
      }); 

      //maintain hash on post back 
      $('#<%=Page.Form.ClientID%>').attr('onsubmit', 'this.action += top.location.hash'); 
      }) 
    </script> 

    <div id="tabs"> 
     <ul> 
      <li><a href="#tabs-1">AFRICA</a></li> 
      <li><a href="#tabs-2">EUROPE</a></li> 
      <li><a href="#tabs-3">AMERICA</a></li> 
     </ul> 
     <div id="tabs-1"> 
      tab 1 
     </div> 
     <div id="tabs-2"> 
      tab 2 
      <asp:Button ID="Button2" runat="server" Text='click' /> 
     </div> 

     <div id="tabs-3"> 
      tab 3 
      <asp:Button ID="Button3" runat="server" Text='click' /> 
     </div> 
    </div> 

Вам нужно только изменить код JavaScript

Answer 2

У меня есть другое решение, реализованное и протестированное с помощью chrome, IE и сафари.

Я использую объект «localStorage», и он предполагает работать со всеми браузерами, которые поддерживают localStorage.

В событии щелчка вкладки я сохраняю значение currentTab для локального хранилища.

Это будет работать, поскольку страница содержимого не добавляет URL-адрес с помощью хэша.

$(document).ready(function() { 
     jQuery('.ctabs .ctab-links a').on('click', function(e) { 
      var currentAttrValue = jQuery(this).attr('href'); 
      localStorage["currentTab"] = currentAttrValue; 

      // Show/Hide Tabs 
      jQuery('.ctabs ' + currentAttrValue).show().siblings().hide(); 

      // Change/remove current tab to active 
      jQuery(this).parent('li').addClass('active').siblings().removeClass('active'); 

      e.preventDefault(); 
     }); 
     if (localStorage["currentTab"]) { 
      // Show/Hide Tabs 
      jQuery('.ctabs ' + localStorage["currentTab"]).show().siblings().hide(); 
      // Change/remove current tab to active 
      jQuery('.ctabs .ctab-links a[href$="' + localStorage["currentTab"] + '"]').parent('li').addClass('active').siblings().removeClass('active'); 
     } 
    });