jQuery点击下拉菜单的展示与隐藏
首先点击显示某个div,然后要求再次点击时消失,或者点击document的其他地方会隐藏掉这个层,涉及到冒泡的问题,阻止document冒泡到dom上。代码如下:
var $el = $(".search-more, .article-query-list li");
$el.click(function(e){
e.stopPropagation();
$(this).toggleClass('active');
});
$(document).on('click',function(e){
if(($(e.target) != $el) && ($el.hasClass('active'))){
$el.removeClass('active');
// console.log("yes");
}
});
jQuery点击下拉菜单的展示与隐藏的更多相关文章
- jquery实现多级下拉菜单
支持多种浏览器,体验效果:http://keleyi.com/keleyi/phtml/jqmenu/4.htm 多级菜单,理论上支持无限多的层级,文件结构非常简单的,以下是完整代码: <!DO ...
- jQuery+Superfish制作下拉菜单
superfish制作下拉菜单真的很方便而好很好用,而且还可以通过Superfish提供的参数来控制下拉菜单的不同效果,而且他没有层级限制,换句话说可以通过Superfish来写你想要的层级菜单. 官 ...
- js和jQuery写简单下拉菜单
1.jQuery写法 <head> <meta http-equiv="Content-Type" content="text/html; charse ...
- JQuery设置获取下拉菜单选项的值 多实例
分享下JQuery如何设置获取下拉菜单某个选项的值,多种方法,值得收藏. JQuery获取和设置Select选项 获取Select :获取select 选中的 text :$(“#ddlRegType ...
- 基于jquery网站左侧下拉菜单
网站左侧下拉菜单jQuery代码.这是一款蓝色风格的适合做后台下拉菜单代码.效果图如下: 在线预览 源码下载 实现的代码: <div class="container"& ...
- javascript实现下拉菜单的显示与隐藏
demo.html <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- jquery 只有二级下拉菜单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery cxSelect 联动下拉菜单
插件简介 cxSelect 是基于 jQuery 的多级联动菜单插件,适用于省市.商品分类等联动菜单. 列表数据通过 AJAX 获取,也可以自定义,数据内容使用 JSON 格式. 同时兼容 Zepto ...
- jquery mobile selectmenu下拉菜单
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...
随机推荐
- Zend Framework 3.0 安装及创建初始化项目教程
前言: 最近开始接触关于PHP的框架的学习,然而PHP的框架少说也有七八种. 百度了一下,有人说ThinkPHP简单暴力的,有人说Laravel高大上的,等等等等,难以抉择. 最终我还是选择先从接触Z ...
- 【BZOJ】 2463 [中山市选2009]谁能赢呢?(博弈论)
Description 小明和小红经常玩一个博弈游戏.给定一个n×n的棋盘,一个石头被放在棋盘的左上角.他们轮流移动石头.每一回合,选手只能把石头向上,下,左,右四个方向移动一格,并且要求移动到的 ...
- OWLQN算法
一.BFGS算法 算法思想如下: Step1 取初始点,初始正定矩阵,允许误差,令: Step2 计算: Step3 计算,使得 : Step4 令: Step5 如果,则取为 ...
- 移动端效果之Picker
写在前面 接着前面的移动端效果的研究,这次来看看picker选择器的实现原理 移动端效果之Swiper 代码看这里:github 1. 核心解析 1.1 基本HTML结构 <!-- 说明: 1. ...
- zoj 1938 Binomial Showdown 组合数裸基础
Binomial Showdown Time Limit: 2 Seconds Memory Limit: 65536 KB In how many ways can you choose ...
- 一些实用的JQuery代码片段收集(筛选,搜索,样式,清除默认值,多选等)
//each遍历文本框 清空默认值 $(".maincenterul1").find("input,textarea").each(function () { ...
- 【实验吧】Once More
<?php if (isset ($_GET['password'])) { if (ereg ("^[a-zA-Z0-9]+$", $_GET['password']) = ...
- ReactiveCocoa_v2.5 源码解析之架构总览
ReactiveCocoa 是一个 iOS 中的函数式响应式编程框架,它受 Functional Reactive Programming 的启发,是 Justin Spahr-Summers 和 J ...
- Servlet实现后台分页查询
相信大家在搭建后台的时候,经常会使用到分页功能,当然,目前有不少框架(如esayUI)都自带分页的实现,为了更好的理解分页原理,近期本人自己摸索了关于分页查询的一些心得. 归根结底,分页的核心还是在封 ...
- 记一次vscode升级后,格式化Vue出现的问题
一.VSCode中使用vetur插件格式化vue文件时,stylus代码会自动加上大括号.冒号和分号 本来就是简写比较方便舒服,结果一个格式化回到十年前 解决方案: vscode 文件 ->首 ...