Jquery UI Tabs 仅重新加载选项卡内容

Question

<div id="example">
     <ul>
         <li><a href="ahah_1.aspx"><span>Content 1</span></a></li>
         <li><a href="ahah_2.aspx"><span>Content 2</span></a></li>
         <li><a href="ahah_3.aspx"><span>Content 3</span></a></li>
     </ul>
</div>

我在 Ajax 模式下使用 Jquery ui 选项卡。当我的页面 ahaha_1.aspx 回发时，我的主页消失，并且我被重定向到 ahaha_1.aspx。如何让它仅重新加载选项卡而不是整个页面。

Answer 1

$('#example').tabs({
    load: function(event, ui) {
        $('a', ui.panel).click(function() {
            $(ui.panel).load(this.href);
            return false;
        });
    }
});

来自 JQuery ui - 选项卡演示

Answer 2

要重新加载选项卡，您需要一个按钮或其他东西来触发此命令，然后重新加载当前选定的选项卡。

$("#tabs").tabs('load', $("#tabs").tabs("option","selected"));

$("#tabs").tabs("option","selected") 正在抓取当前选定的选项卡。

Answer 3

添加此

 $('#tabs').tabs({ active: $('#<%= hdf_tabNumber.ClientID %>').val() });
      $('#tabs').tabs({
           activate: function(event, ui) {
               var selected = $(this).tabs('option', 'active');
               $('#<%= hdf_tabNumber.ClientID %>').val(selected);
                //alert($('#<%= hdf_tabNumber.ClientID %>').val());
           }
 });

Create this input 标签即可。

<asp:HiddenField  id="hdf_tabNumber" runat="server"></asp:HiddenField>

只需在您的正文代码中