Javascript 单击并通过哈希激活引导选项卡/药丸
我有引导标签和药丸，我有一些函数可以在单击时更改活动类，从而激活该标签的css样式。例如，当我从电子邮件重定向时，我也有一个功能可以转到sepcific药丸 但我有个问题。当页面加载时，第一个选项卡具有活动类，我可以单击其他选项卡并转到那里。好啊但是当我想被重定向到药片时，我只能转到第一个标签的药片。我无法从其他选项卡激活药丸，可能是因为fist选项卡仍处于活动状态 以下是我的JQuery函数：Javascript 单击并通过哈希激活引导选项卡/药丸,javascript,jquery,css,asp.net,twitter-bootstrap,Javascript,Jquery,Css,Asp.net,Twitter Bootstrap,我有引导标签和药丸，我有一些函数可以在单击时更改活动类，从而激活该标签的css样式。例如，当我从电子邮件重定向时，我也有一个功能可以转到sepcific药丸 但我有个问题。当页面加载时，第一个选项卡具有活动类，我可以单击其他选项卡并转到那里。好啊但是当我想被重定向到药片时，我只能转到第一个标签的药片。我无法从其他选项卡激活药丸，可能是因为fist选项卡仍处于活动状态 以下是我的JQuery函数： $(function () { $("#tabs").tabs({
$(function () {
$("#tabs").tabs({
activate: function () {
var selectedTab = $('#tabs').tabs('option', 'active');
$("#<%= hdnSelectedTab.ClientID %>").val(selectedTab);
},
active: $("#<%=hdnSelectedTab.ClientID%>").val()
});
});
$(function () {
var hash = document.location.hash;
if (hash) {
$('.nav-tabs a[href="' + hash + '"]').tab('show');
}
$('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
window.location.hash = e.target.hash;
});
});
$(function () {
var hash = document.location.hash;
if (hash) {
$('.nav-pills a[href="' + hash + '"]').tab('show');
}
$('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
window.location.hash = e.target.hash;
});
});
$（函数（）{
$（“#制表符”）。制表符({
激活：函数（）{
var selectedTab=$（'#tabs'）。tabs（'option'，'active'）；
$（“#”）val（选定的选项卡）；
},
活动：$（“#”）val（）
});
});
$（函数（）{
var hash=document.location.hash；
if（散列）{
$（'.nav tabs a[href=“'+hash+''“]”）选项卡（'show'）；
}
$（'a[data toggle=“tab”]”）on（'show.bs.tab'，函数（e）{
window.location.hash=e.target.hash；
});
});
$（函数（）{
var hash=document.location.hash；
if（散列）{
$（'.nav.a[href=“'+hash+''“]”）选项卡（'show'）；
}
$（'a[data toggle=“tab”]”）on（'show.bs.tab'，函数（e）{
window.location.hash=e.target.hash；
});
});
<asp:HiddenField ID="hdnSelectedTab" runat="server" Value="0" />
菜单2
在所有人都有错误的情况下，我们必须清楚地看到，所有的人都有错误
<div class="row back-style-inside">
<ul class="nav nav-tabs">
<li><a class="active" data-toggle="tab" href="#perfil" class="font-general">Perfil</a></li>
<li><a data-toggle="tab" href="#grupos" class="font-general">Os Meus Grupos</a></li>
<li><a data-toggle="tab" href="#menu2" class="font-general">Menu 2</a></li>
</ul>
<div class="tab-content">
<div id="perfil" class="tab-pane fade in active">
<ul class="nav nav-pills nav-stacked col-sm-4 col-md-3">
<li><a data-toggle="tab" href="#avatar" class="font-general">Avatar</a></li>
<li><a data-toggle="tab" href="#password" class="font-general">Alterar Palavra-Passe</a></li>
</ul>
<div class="tab-content col-sm-offset-4 col-md-offset-3">
<div id="avatar" class="tab-pane fade">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<div class="modal-load">
<div class="center">
<img src="Recursos/Imagens/Loading.gif" />
</div>
</div>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Image ID="img_Avatar" runat="server" />
<br />
<asp:FileUpload ID="file_Avatar" type="file" name="file" onchange="previewFile()" runat="server" />
<br />
<asp:Label runat="server" class="font-general color-white" Text="* Dimensões máximas: 162 x 290 (L x A); Tamanho máximo: 512Kb; Formatos aceites: GIF, JPG, e PNG."></asp:Label>
<br />
<br />
<asp:Button ID="btn_AlterarAvatar" runat="server" Text="Confirmar Alteração" class="btn btn-default" OnClick="btn_AlterarAvatar_Click" />
<br />
<asp:Label ID="lbl_ErroAvatar" runat="server" class="font-general color-white"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div id="password" class="tab-pane fade">
<div class="color-white font-general-big">Alterar Palavra-Passe</div>
<div class="col-xs-12" style="padding: 0; margin: 0;">
<div class="col-xs-11" style="display: inline-block; vertical-align: middle; padding: 0; margin: 0;">
<asp:TextBox ID="tb_PalavraPasse" runat="server" placeholder="Palavra-Passe" class="form-control object-fit-cover" TextMode="Password"></asp:TextBox>
</div>
<div class="col-xs-1 pull-right" style="display: inline-block; vertical-align: middle;">
<img id="img_Eye" runat="server" src="~/Recursos/Imagens/eye-icon.png" onmouseover="MouseOver_MudarTipoPassword()" onmouseout="MouseLeave_MudarTipoPassword()" />
</div>
<br />
<br />
<asp:TextBox ID="tb_ConfirmacaoPalavraPasse" runat="server" placeholder="Confirme a Palavra-Passe" class="form-control object-fit-cover" TextMode="Password"></asp:TextBox>
<br />
</div>
<asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
<ProgressTemplate>
<div class="modal-load">
<div class="center">
<img src="Recursos/Imagens/Loading.gif" />
</div>
</div>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Button ID="btn_AlterarPassword" runat="server" Text="Alterar" class="btn btn-default" OnClick="btn_AlterarPassword_Click" />
<br />
<asp:Label ID="lbl_ErroPassword" runat="server" class="font-general color-white"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</div>
<div id="grupos" class="tab-pane fade">
<ul class="nav nav-pills nav-stacked col-sm-4 col-md-3">
<li><a data-toggle="tab" href="#gruposTodos" class="font-general">Todos</a></li>
<li><a data-toggle="tab" href="#gruposAdmin" class="font-general">Alterar Palavra-Passe</a></li>
</ul>
<div class="tab-content col-sm-offset-4 col-md-offset-3">
<div id="gruposTodos" class="tab-pane fade">
<asp:UpdateProgress ID="UpdateProgress3" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
<ProgressTemplate>
<div class="modal-load">
<div class="center">
<img src="Recursos/Imagens/Loading.gif" />
</div>
</div>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel3" runat="server">
<ContentTemplate>
<br />
<div style="width: 100%; text-align: center;">
<asp:Label ID="lbl_Grupos" Style="width: 100%; text-align: center; display: block;" runat="server" class="font-general color-white" Text="Grupos"></asp:Label>
<asp:DropDownList ID="ddl_Grupos" runat="server" class="btn btn-default font-general" AutoPostBack="True" OnSelectedIndexChanged="ddl_Grupos_SelectedIndexChanged"></asp:DropDownList>
</div>
<br />
<div class="col-xs-6">
<asp:Label ID="lbl_TituloUtilizadores" Style="width: 100%; text-align: center; display: block;" runat="server" class="font-general color-white" Text="Utilizadores do grupo"></asp:Label>
<br />
<asp:ListBox ID="lb_Utilizadores" Style="width: 100%; text-align: center;" runat="server"></asp:ListBox>
</div>
<div class="col-xs-6">
<asp:Label ID="lbl_TituloCompeticoes" Style="width: 100%; text-align: center; display: block;" runat="server" class="font-general color-white" Text="Competições em que o grupo aposta"></asp:Label>
<br />
<asp:ListBox ID="lb_Competicoes" Style="width: 100%; text-align: center;" runat="server"></asp:ListBox>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</div>
<div id="menu2" class="tab-pane fade">
<h3>Menu 2</h3>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.</p>
</div>
</div>