<div class="menu">
    <a href="javascript:void(0);" id="a_all" runat="server" class="all" onclick="showMenu()" hidefocus="true">全部</a>
    <div id="divMenu" class="menu_l" style="display: none;" onmouseout="hideMenu(this,event)">
        <asp:LinkButton ID="lbtnDeptAll" runat="server" Text="全部" CssClass="zero"></asp:LinkButton>
        <asp:LinkButton ID="lbtnDeptOne" runat="server" Text="一区" CssClass="one"></asp:LinkButton>
        <asp:LinkButton ID="lbtnDeptTwo" runat="server" Text="二区" CssClass="two"></asp:LinkButton>
    </div>
</div>
/*注意其中的div都要指定高度,否则也会造成鼠标进入a标签后就隐藏了*/
 
/*js解决的难点:当前子菜单包含a标签,一定进入该a标签后,就被隐藏了,即触发了hideMenu()方法,以下js就是解决了这个难题*/
function showMenu() {
    document.getElementById("divMenu").style.display = "";
}
function hideMenu(obj, e) {
    if (e.currentTarget) {
        if (e.relatedTarget != obj) {
            if (obj != e.relatedTarget.parentNode) {
                document.getElementById("divMenu").style.display = "none";
            }
        }
    } else {
        if (e.toElement != obj) {
            if (obj != e.toElement.parentNode) {
                document.getElementById("divMenu").style.display = "none";
            }
        }
    }
}

点击显示子菜单,离开隐藏子菜单(onmouseout下包含a标签的js解决方法)的更多相关文章

  1. ASP.NET Menu控件点击区域太小解决方法

    ASP.NET自带的Menu控件点击区域比较小,基本就是文本范围和图片范围,在区域外虽然选择的项有颜色变化,但是这个时候点击是没有用的,体验不是很好 检查前台生成的HTML,是用td嵌套a标签,a标签 ...

  2. 关于Hexo,Next主题的‘下一页’、‘上一页’按钮错误显示为html代码 的解决方法

    关于Next主题的'下一页'.'上一页'按钮错误显示为html代码的解决方法 我在建立自己的博客过程中遇到了页面'下一页'和'上一页'按钮显示为html代码<i class="fa f ...

  3. SecureCRT中文显示乱码的解决方法

    注:本文出自:http://riching.iteye.com/blog/349754 最近开始用SecureCRT登陆linux系统,由于是新手,很多问题不清楚,碰到显示中文乱码的问题,困扰了好几天 ...

  4. jQuery - 制作点击显示二级菜单效果

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  5. Android开发之Menu:OptionMenu(选项菜单)、ContextMenu(上下文菜单)、SubMenu(子菜单)

    菜单的概念,现在已经很普及了.Windows系统.Mac.桌面版Linux.Java Swing等,都有可视化菜单.一.Android平台3种菜单  选项菜单(OptionMenu).上下文菜单(Co ...

  6. django 权限设置 左侧菜单点击显示,面包屑

    1.左侧菜单点击显示 就是在点击的时候保留点击的功能 方法. 1.加入新的字段,pid来判断 class Permission(models.Model): """ 权限 ...

  7. js 导航栏多项点击显示下拉菜单代码

    <!DOCTYPE html> <html> <head> <title>Dropdown</title> <!--<link ...

  8. JS点击显示隐藏内容

    JS点击显示隐藏密码 思路:获取元素,判断点击,如果DIV显示就隐藏,如果DIV隐藏就显示出来. 1 if(DIV是显示的){ 2 div.style.display='none'; 3 } 4 el ...

  9. jQuery 点击显示再次点击隐藏

    <html> <head> <script type="text/javascript" src="/jquery/jquery.js&qu ...

随机推荐

  1. 使用bootstrap时,选项框出现的意外效果,怎么办?

    <label for="" style="float:right;margin-right:10%;">     <input type=&q ...

  2. 函数 - PHP手册笔记

    用户自定义函数 函数无需在调用前被定义,除非是有条件定义的. PHP中的所有函数和类都具有全局作用域.PHP不支持函数重载,也不可能取消定义或者重定义已声明的函数. 特意试了下,我的电脑上的PHP递归 ...

  3. python用法——Mixin

    在读werkzeug和flask的源码中,经常能遇到类名中有mixin这个东西.这个东西的用法让我想到了java中的接口名有able的用法.今天我就来看了看这个mixin是什么东西. 学习了pytho ...

  4. 独木舟上的旅行--nyoj题目71

    独木舟上的旅行 时间限制:3000 ms  |  内存限制:65535 KB 难度:2   描述 进行一次独木舟的旅行活动,独木舟可以在港口租到,并且之间没有区别.一条独木舟最多只能乘坐两个人,且乘客 ...

  5. *1022. D进制的A+B【考前最后一道题】

      /* *Main.c *1022. D进制的A+B Ver.1 *Created on : 2014.9.5 *****测试通过****** */ #include <stdio.h> ...

  6. mysql tee 命令

    tee 命令说明: 用过mysql的应该都会知道mysql有一个叫show 的命令,这个命令应该是SQL标准之外的一个扩展:和这个类似mysql还扩展了一个叫tee的命令. tee的功能是把你的所有输 ...

  7. Nand flash 的发展和eMMC

    讨论到eMMC的发展历程,必须要从介绍Flash的历史开始 Flash分为两种规格:NOR Flash和NAND Flash,两者均为非易失性闪存模块. 1988年,Intel首次发出NOR flas ...

  8. 整理幾種常見PCB表面處理的優缺點

    這只是一篇整理文,而且我個人僅從事過後段的電路板組裝,而未從事過電路板製程,所以有些見解純粹只是個人看法,如果有些不一樣的聲音或錯誤也歡迎留言討論. 隨著時代的演進,科技的進步,環保的要求,電子業也隨 ...

  9. TComponent与String的转换(得到控件的DFM格式的描述)

    现看下面这两个方法,把一个TComponent做成String,再就是把String转成TComponent function ComponentToStringProc(Component: TCo ...

  10. Inno Setup GIF 显示插件 GIFCtrl (V2.1 版本)

    原文 http://restools.hanzify.org/article.asp?id=79  引用来自 test.iss ; -- test.iss --; restools; http://r ...