Question

我正在使用带有asp.net（webform）应用程序的jQuery UI的Tabs插件。

由于页面中有一些回发，我想保留当前标签。我正在尝试使用以下标记代码，但这不起作用：

<input type="hidden" name="selectedTab" id="selectedTab" value="<%= Page.Request.Form["selectedTab"] %>" />

<script type="text/javascript">
    $(function () {
        $("#ActionTabs")
            .tabs()
            .bind("tabsselect", function (event, ui) {
                $("#selectedTab").val(ui.index);
            })
            .tabs("select", $("#selectedTab").val());

    });
</script>

<div id="ActionTabs">
    <ul>
         <li><a href="#tab1">Tab1</a></li>
         <li><a href="#tab2">Tab2</a></li>
    </ul>
    <div id="tab1">
    </div>
    <div id="tab2">
    </div> 
</div>

使用开发人员工具，我可以看到我在选择选项卡时正确设置了隐藏的selectedTab，并在回发后正确设置，但在页面加载后总是选择第一个选项卡。

我的代码有什么问题？

Answer 1

好的，我找到了另一种声明标签的方法：

<script type="text/javascript">
    $(function () {
        $("#ActionTabs")
            .tabs({
                selected : $("#selectedTab").val(),
                select: function (event, ui) {
                    $("#selectedTab").val(ui.index);
                }
            });

    });
</script>

这一次，它按预期工作。不确定为什么第一个版本无效。

Answer 2

我认为由于将两个锚标签链接到同一个tab1

而出现了问题

<ul>
     <li><a href="#tab1">Tab1</a></li>
     <li><a href="#tab1">Tab2</a></li>
</ul>

持久化jQuery选项卡所选项目不起作用

2 个答案: