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

截图:

代码如下:

    //关闭用户菜单
$(document).mousedown(function(e){
var _con = $('.drop_down');
//1. 点击事件的对象不是目标元素本身
//2. 事件对象同时也不是目标元素的子元素
if(!_con.is(e.target) && _con.has(e.target).length===0){
$('.drop_down').css('display','none');
}
});

jq自定义下拉菜单,当用户点击非自身元素(下拉菜单)本身时关闭下拉菜单的更多相关文章

  1. vue自己写了一个div菜单,点击按钮展开,点击其他地方关闭这个div菜单

    需求是通过点击body页面,在其他地方就关闭这个<div>菜单,给这个div一个id:problemList,但是点击我打开的按钮,不关闭. created () { document.o ...

  2. jq自定义下拉菜单,在点击非当前下拉菜单区域时,关闭下拉菜单(点击事件的对象不是目标元素本身)

    jq自定义下拉菜单,在点击非当前下拉菜单区域时,关闭下拉菜单(点击事件的对象不是目标元素本身) //点击非当前下拉菜单区域时,关闭下拉菜单 $(document).mousedown(function ...

  3. 有序无序Ul->Li Ol->Li菜单,默认点击当前弹出下拉,再次点击收起下拉菜单(变形2 ---修饰)

    从上面可以看出,两个问题,第一:下拉出现的太快太突然,第二:再点击下一个下拉菜单的时候,上一个不会闭合,针对这两个问题,接下来会一 一解决. 解决下拉太快: js中有个jquery效果,有一个效果是j ...

  4. jq点击改变元素样式、添加类,显示隐藏,图标旋转,再次点击还原;表格点击显示下拉详情

    点击前 点击后 <tr> <td class="right" data-id="{$vo.id}" id="{$vo.id}&quo ...

  5. JQ自定义下拉列表插件

    自从上次做了JQ自定义分页插件和表格插件后,就没在自定义过插件了,这一个月都在用linq和ef,基本前端都没怎么去碰了,今天有个同事说有个项目需要在下拉框里面带有复选框,本来想网上找下插件的,一想,其 ...

  6. Linux下VsFTP和ProFTP用户管理高级技巧 之一

    Linux下VsFTP和ProFTP用户管理高级技巧       FTP服务时互联网上比较古老的一种应用,至今Interner应用面非常广泛,但令管理员头痛不已的是其用户管理,既多且杂,如何解决这一问 ...

  7. (二)spring Security 自定义登录页面与校验用户

    文章目录 配置 security 配置下 MVC 自定义登录页面 自定义一个登陆成功欢迎页面 效果图 小结: 使用 Spring Boot 的快速创建项目功能,勾选上本篇博客需要的功能:web,sec ...

  8. 解决iphone填写表单时,表单项获取焦点时往下拉屏,导致顶部标题栏下滑错位

    $(function () { //解决iphone填写表单时,表单项获取焦点时往下拉屏,导致顶部标题栏下滑错位 var u = navigator.userAgent; var isiOS = !! ...

  9. Linux系统下给非root用户添加sudo权限

    Linux系统下给非root用户添加sudo权限 有时,在linux系统中非root用户运行sudo命令,会提示类似信息:  xxx is not in the sudoers file. This ...

随机推荐

  1. php实现求二进制中1的个数(右移、&、int32位)(n = n & (n - 1);)

    php实现求二进制中1的个数(右移.&.int32位)(n = n & (n - 1);) 一.总结 1.PHP中的位运算符和java和c++一样 2.位移运算符看箭头方向,箭头向左就 ...

  2. 小强的HTML5移动开发之路(49)——HTML5开发神器HBuilder

    今天给大家介绍一款开发HTML5的神器--HBuilder. 下载地址:http://www.dcloud.net.cn/ 一.新建文件 可以看到支持web app开发和普通网站前端开发,我们首先建立 ...

  3. 全栈JavaScript之路( 二十五 )訪问元素的样式

    不论什么支持style 特性的元素在 ,在其DOM  节点 对象中都有一个 style 属性与之相应. 这个style 对象是 CSSStyleDeclaration类型的实例,包括着html sty ...

  4. 三天打渔,俩天晒网(C++实现)

    #include <iostream> using namespace std; int leap (int a) {     if (a%4==0%a%100!=0||a%400==0) ...

  5. PhpStorm常用快捷键(不多够用)

    PhpStorm常用快捷键(不多够用) 一.总结 一句话总结: 1.前进 解答:Ctrl+shift+ z 2.跳转到指定行数 解答:Ctrl+G 3.块注释 解答:ctrl + shift + / ...

  6. Methods and systems to control virtual machines

    Methods and systems are provided to control the execution of a virtual machine (VM). A VM Monitor (V ...

  7. [转至云风的博客]谈谈陌陌争霸在数据库方面踩过的坑( Redis 篇)

    « 谈谈陌陌争霸在数据库方面踩过的坑(芒果篇) | 返回首页 | linode 广告时间 » 谈谈陌陌争霸在数据库方面踩过的坑( Redis 篇) 注:陌陌争霸的数据库部分我没有参与具体设计,只是参与 ...

  8. 【u203】文件夹计数

    Time Limit: 1 second Memory Limit: 128 MB [问题描述] 可以用路径来描述文件夹,路径为一个包含若干部分的字符串,之间用'/'分隔.每部分均为一个文件夹的名称, ...

  9. 学习鸟哥的Linux私房菜笔记(5)——目录

    一.目录 目录在文件类型上用d来表示,用 / 分割目录层 Linux操作系统 都有且仅有一个起始目录,我们用一个单独的 /来表示,称其为根目录. 对每一个Shell和操作环境,都有一个当前的工作目录. ...

  10. HTML5 的成长之路

    html5历史 w3c从2008年提出html5的概念,目前html5的版本已经趋于稳定,也逐步得到了业界的认可和接受. 以前我们有一个疑问,HTML5与Flash究竟谁将在移动互联网时代称霸市场?这 ...