接下拉菜单那一篇:

加上点击其它位置,下拉菜单消失。

纯js写法:

 window.document.addEventListener('click', function(e) {
var e = e || window.event; //浏览器兼容性
var elem = e.target || e.srcElement;
while (elem) { //循环判断至跟节点,防止点击的是div子元素
if (elem.id && elem.id == 'xianshi' ) {
return;
}
elem = elem.parentNode;
}
var s = document.getElementsByClassName("xiang");
for(i=0;i<s.length;i++)
  {
s[i].style.display = "none";
  }
//点击的不是div或其子元素
});

点击其它位置,div下拉菜单消失的更多相关文章

  1. jq自定义下拉菜单,当用户点击非自身元素(下拉菜单)本身时关闭下拉菜单

    jq自定义下拉菜单,当用户点击非自身元素(下拉菜单)本身时关闭下拉菜单 截图: 代码如下: //关闭用户菜单 $(document).mousedown(function(e){ var _con = ...

  2. 【android开发】使用PopupWindow实现页面点击顶部弹出下拉菜单

    没有太多花样,也没有很复杂的技术,就是简单的PopupWindow的使用,可以实现点击弹出一个自定义的view,view里可以随便设计,常用的可以放一个listview. demo中我只是一个点击展示 ...

  3. div模拟dropdownlist控件 div下拉菜单

    原文发布时间为:2009-10-16 -- 来源于本人的百度文章 [由搬家工具导入] 控件发布:div2dropdownlist(div模拟dropdownlist控件) div3dropdownli ...

  4. (JavaScript插件——下拉菜单)

    前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html 本文主要来学习一下JavaScrip ...

  5. 【JavaScript 11—应用总结】:下拉菜单

    导读:在web页面的显示中,总是免不了下拉菜单的设置.怎样将菜单设置的更好玩一点呢?这次,就将实现一个下拉菜单的制作.当鼠标移入的时候,菜单显示,鼠标移走,菜单关闭. 一.实现分析 首先,制作一个下拉 ...

  6. js模拟下拉菜单-键盘、鼠标(代码详解)

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

  7. Dropdown 下拉菜单

    将动作或菜单折叠到下拉菜单中. 基础用法 移动到下拉菜单上,展开更多操作. 通过组件slot来设置下拉触发的元素以及需要通过具名slot为dropdown 来设置下拉菜单.默认情况下,下拉按钮只要ho ...

  8. 10个优秀的 HTML5 & CSS3 下拉菜单制作教程

    下拉菜单是一个很常见的效果,在网站设计中被广泛使用.通过使用下拉菜单,设计者不仅可以在网站设计中营造出色的视觉吸引力,但也可以为网站提供了一个有效的导航方案.使用 HTML5 和 CSS3 可以更容易 ...

  9. 11个优秀的HTML5 & CSS3下拉菜单制作教程

    下拉菜单是一个很常见的效果,在网站设计中被广泛使用.通过使用下拉菜单,设计者不仅可以在网站设计中营造出色的视觉吸引力,但也可以为网站提供了一个有效的导航方案.使用HTML5和CSS3可以更容易创造视觉 ...

随机推荐

  1. 启动服务器 SEVERE: Error configuring application listener of class org.springframework.web.context.ContextLoaderListener

    意思是spring.jar这个包在发布的时候没有被放入war.如果是maven管理的项目,可以看看这个项目的部署参数里有没有加入所有maven的包. 右键项目->Properties->D ...

  2. Goroutine调度器

    前言 并发(并行)一致都是编程语言的核心主题,不同于其他语言,例如C/C++语言用户序自行借助pthread创建线程,Golang天然就给出了并发解决方案:goroutine. Goroutine 写 ...

  3. java图片处理(加水印、生成缩略图)等之Thumbnailator库

    Thumbnailator 是一个为Java界面更流畅的缩略图生成库.从API提供现有的图像文件和图像对象的缩略图中简化了缩略过程,两三行代码就能够从现有图片生成缩略图,且允许微调缩略图生成,同时保持 ...

  4. DEPICT实现基因优化(gene prioritization)、gene set富集分析(geneset enrichment)、组织富集分析(tissue enrichment)

    全基因组关联分析除了找到显著的关联位点,我们还可以做基因优化.geneset富集分析.组织富集分析,下面具体讲一讲怎么利用GWAS的summary数据做这个分析. summary数据就是关联分析的结果 ...

  5. [LeetCode] 723. Candy Crush 糖果粉碎

    This question is about implementing a basic elimination algorithm for Candy Crush. Given a 2D intege ...

  6. python gzip

    通常用gzip压缩过的云端数据需要做解压处理,以下代码主要用python3实现对获取到的云端gzip压缩数据进行还原. # -*- coding: utf-8 -*- ""&quo ...

  7. [资料]ObjectARX 2020参考指南翻译中文版

    chm使用Google Chrome浏览器翻译,有些翻译不是很理想,因为2万5千多个html文件, 修正难度太大,所以只处理了一部分. 非常感谢 gzxl 辛苦肉眼修正一些翻译问题. 欢迎进入QQ群: ...

  8. C/C++ 面试-内存对齐 即不同数据类型存储空间

    下面列举了Dev-C++下基本类型所占位数和取值范围: 基本型                          所占位数              取值范围                输入符举例 ...

  9. Django ORM 数据库设置和读写分离

    一 Django的数据库配置 (一)修改settings.py文件关于数据库的配置: Django默认使用sqlite: DATABASES = { 'default': { 'ENGINE': 'd ...

  10. java获取当前项目路径System.getProperty("user.dir")

    System.getProperty("user.dir") 就是项目的文件夹绝对路径