<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. linux下C++对线程的封装

    之前一直是使用C语言,前段时间转做C++.无论使用什么语言,多线程编程都是不可或缺的.最近项目中又用到了线程,现在将线程的封装做出总结: 1.线程类中应该包含线程ID.线程的状态以及线程基本操作等. ...

  2. js 跨域的使用

    try{document.domain="jincin.com"}catch(error){} 需要在被调用的函数和调用函数出都要加入上面相同的语句 下面看一下第二种跨域的解决方案 ...

  3. 【Lucene4.8教程之六】QueryParser与Query子类:如何生成Query对象

    一.概述 1.对于一个搜索而言,其核心语句为: searcher.search(query, 10); 此时,其最重要的参数为一个Qeury对象.构造一个Query对象有2种方法: (1)使用Quer ...

  4. HTML5 canvas 在线画笔绘图工具(三)

    组装画板(TDrawBuilder) 在这一小节中我们要把工具条和画板组装起来,让他们可以协同进行工作. 画板通过一个命名为TDrawBuilder来进行组装.在详细讲解TDrawBuilder对象之 ...

  5. mysql 根据规定的数组进行排序

    最近在开发中遇到一个问题,我要根据一组商品的佣金进行排序和分页,可是佣金并不在商品表中,于是我就只能通过数组的操作把佣金计算出来,然后通过array_multisort()方法进行排序,可是无法做到分 ...

  6. Android平台对H264视频硬解码

    本文讲述如何使用Android标准的API (MediaCodec)实现H264的硬件解码. 原本我们是用JNI调用平台提供的硬件解码接口得到YUV帧,再放入opengl脚本里处理渲染的.可是换了新平 ...

  7. openjpa框架入门_openbooks项目Overview(四)

  8. 体验下Xcode5与ios7

    IOS7的最新更新. 1.自主选择默认地图应用苹果在iOS 6中移除了谷歌地图,使用了自家研发的苹果地图.不得不说,这款自带的地图应用可以说烂到了一定的程度,自发布之后便问题不断.正因如此,苹果应该允 ...

  9. Linux(gnu)环境动态链接库的搜索路径

    摘自http://blog.csdn.net/saga1979/article/details/14161229 man ld.so(8)说,如果库依赖不包括“/”,那么它将按照下面的规则按顺序搜索: ...

  10. 我使用过的Linux命令之file - 检测并显示文件类型

    摘自:http://codingstandards.iteye.com/blog/804463 我使用过的Linux命令之file - 检测并显示文件类型 用途说明 file命令是用来检测并显示文件类 ...