选择某个选项卡时隐藏asp.net按钮

Question

我有一个标签页设置和asp按钮。

<div id="tabs" style="width:700; height:1000">
    <ul>
    <li><a href="#tabs-1">Referral</a></li>
    <li><a href="#tabs-2">Details</a></li>
    <li><a href="#tabs-3">Other</a></li>
    </ul>
    <div id="tabs-1"></div>
    <div id="tabs-2"></div>
    <div id="tabs-3"></div>
    <asp:Button ID="btnMainSave" runat="server" Text="Save" />    
</div>

当tabs-3被选中时，我希望按钮是不可见的，但对于前两个选项卡是可见的。考虑到我是一个初学者，我如何使用jquery来实现这一点呢？我已经尝试了下面的代码，但它不起作用。

<script type="text/javascript" >
$(function () {
    $('#tabs, #tabs-3').tabs({
        active: function (event, ui) {
            $("#btnMainSave").hide();
        }
    });
});
</script>

任何帮助都将不胜感激。谢谢

抢夺

Answer 1

您需要使用activate事件(而不是active选项)：

$(function () {
    $('#tabs, #tabs-3').tabs({
        activate: function (event, ui) {
            $("#btnMainSave").hide();
        }
    });
});

编辑

您必须添加一些逻辑来检查哪个面板正在被激活，并基于此隐藏button。我不知道您使用的是哪个版本的jQuery UI，但以下内容将在最新版本中运行：

activate: function(e, ui) {
  $('#btnMainSave').toggle( !$(ui.newPanel).is('#tabs-3') );
}

Here's a fiddle

Answer 2

试试这个：

$("#tabs").tabs();
$(".nexttab").click(function() {
    var selected = $("#tabs").tabs("option", "selected");
    $("#tabs").tabs("option", "selected", selected + 1);
});