javascript - 单击链接按钮时显示 Div

标签 javascript html css asp.net

我是 Asp.Net 的新手。在我的应用程序中,当单击用户名显示子菜单并注销时,我需要在菜单中显示用户名。所以我试过这样

 <div id="DivRight">
   <ul> <li><asp:LinkButton ID="lblusername" CssClass="imjusttext"
   ForeColor="#1570a6" Font-Underline="false" Text="Admin" OnClientClick="return false"  
    runat="server"/></li></ul>
 </div>
 <div id="DivSubMenuRight" style="display:none" runat="server">
   <ul> <li><asp:LinkButton ID="lblSignout" CssClass="imjusttext" ForeColor="#1570a6" 
   Font-Underline="false" Text="Sign Out" OnClientClick="return false"  runat="server"/>
   </li></ul>
</div>

我需要服务器代码中的点击事件,所以我使用linkbutton

ASP.NET

   Protected Sub lblusername_Click(ByVal sender As Object, ByVal e As System.EventArgs)
 Handles lblusername.Click
        DivSubMenuRight.Visible = True
    End Sub

Protected Sub lblSignout_Click(ByVal sender As Object, ByVal e As System.EventArgs) 
    Handles lblSignout.Click
         FormsAuthentication.SignOut();
    End Sub

CSS

.imjusttext{ color: #1570a6; text-decoration: none; }
.imjusttext:visited { color: #1570a6; text-decoration: none; }

编辑

当我点击用户名然后显示 div 就像我们将一些标签名称悬停在这里时它显示黑色的矩形框。像那样。怎么做 ?而且我需要在服务器端编码中正确注销单击事件以进行用户身份验证,所以如何编写它。因为它是一个链接按钮?

我正在使用 ASP.NET 2008

最佳答案

使用Jquery 在点击时显示/隐藏元素。这是基本示例。

$('.submenu a').click(function() {
  $(this).parent().find('ul').toggle();
  return false;
});
ul li ul{
  display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="DivSubMenuRight">
  <ul>
    <li class="submenu"><a href="google.com">Signout</a>
      <ul>
        <li>sub menu 1</li>
        <li>sub menu 2</li>
        <li>sub menu 3</li>
      </ul>
    </li>
  </ul>
</div>

关于javascript - 单击链接按钮时显示 Div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35290954/

相关文章:

javascript - 如何在排除某些字符的同时对字符串进行正则表达式测试?

javascript - Flot:如何在条形图中设置数字样式?

html - 使嵌套的 div 拉伸(stretch)到父高度

html - 如何查看http ://in xml formate with xslt

css - 在 iPhone 上滚动我的网站时出现额外的 "Search web"

javascript - 需要在 x 轴上使用 css3 动画动画

javascript - document.execCommand ('copy' ) 命令在字符串的开头和结尾添加换行符

javascript - qTip² - 单击时工具提示保持打开状态不起作用

javascript - 如何在 chrome 中取消隐藏来自某些 js 文件的消息

jquery - 阻止 Google 将特定内容编入索引