1.html

<a id="more" onclick="moreFun()">更多</a>
<ul id="moreList" style="display:none">
<li>列表1</li>
<li>列表2</li>
<li>列表3</li>
</ul>

2.实现点击更多按钮弹出moreLise列表,点击页面其他地方关闭moreLise列表,js代码如下:

//使用toggle方法实现列表的展开和关闭
function moreFun(){
$("#moreList").toggle();
}
//点击页面其他地方关闭
document.onclick = function (e) {
//判断点击的地方是否为“更多”按钮和弹出层是否显示
if(!$(e.target).is(".more") && $("#moreList").is(":visible")==true){
$("#moreList").hide();
}
}

jq点击按钮打开和关闭弹出层,点击除了当前按钮以外的地方关闭弹出层的更多相关文章

  1. 关于JavaScript点击按钮打开多个页面被浏览器以广告嫌疑拦截怎么解决

    JS点击按钮打开新的标签页,工作中遇到需要点击按钮打开一个或多个,需要用到window.open() 工作中我们可能需要打开多个,看以下代码: var data = [{ "id" ...

  2. 新建一个Activity通过按钮打开它,再通过按钮关闭它

    首先需要创建一个供打开和关闭的Activity,先在scr下当前项目的包中创建一个新类Activity1, 并选择让其继承自Activity类,如下图所示: 之后配置AndroidMainifest. ...

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

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

  4. js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框

    转自https://blog.csdn.net/yimawujiang/article/details/86496936 问题:js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框? 方案一 ...

  5. jeecg 弹出框 点击按钮回调父页面 返回值

    jeecg 弹出框 点击按钮回调父页面 返回值 <t:base type="jquery"></t:base> <t:base type=" ...

  6. jQuery点击自身以外地方关闭弹出层

    转载自:http://blog.163.com/abkiss@126/blog/static/325941002012111754349590/ 主要功能是点击显示,然后通过点击页面的任意位置都能关闭 ...

  7. bootstrap 弹出框点击其他区域时弹出框不消失选项设置

    默认情况下,bootstrap 弹出框点击其他区域时,弹出框会自动关闭,在很多时候,我们可能会希望达到和原生弹出框一样的效果,避免不小心点击其他区域时弹框自动隐藏,尤其是对于一些复杂的表单,重复填写可 ...

  8. Android编程实现点击链接打开APP功能示例

    本文实例讲述了Android编程实现点击链接打开APP功能.分享给大家供大家参考,具体如下: 在Android中点击链接打开APP是一个很常见的需求.例如,电商为用户发送优惠券之后经常会下发一条短信: ...

  9. 报错:已有打开的与此命令相关联的 DataReader,必须首先将它关闭。

    SqlParameter[] sp = { new SqlParameter("@nGridID",SqlDbType.BigInt), new SqlParameter(&quo ...

随机推荐

  1. pandaboy Merry Christmas

  2. jmeter实现逻辑控制器

  3. Python的基础知识01 _个人笔记

    1.快捷键:Alt+n 回到上一条语句>把上一条语句复制 Alt+p  去到下一条语句 2.Python 中不用“:”来表示一个语句 3.print("I Love you" ...

  4. C++基础 (4) 第四天 this指针 全局函数和成员函数 友元 操作符重载

    1static强化练习-仓库进货和出货 #define _CRT_SECURE_NO_WARNINGS #include <iostream> using namespace std; c ...

  5. JAVA中各个包的主要作用

    00:48:0800:48:1022013013-06-282013-06-2800:48:182013-06-2800:48:20  java.util是JAVA的utility工具包 java.l ...

  6. PHP 中 call_user_func 的使用

    call_user_func函数类似于一种特别的调用函数的方法,使用方法如下 第一种情况: function set_max($a,$b) { if($a>$b) echo $a; else e ...

  7. js:Array对象常用方法介绍

    前言 在js中,数组作为一个特殊的对象.是我们常用的数据格式.今天就来梳理一下常用的数组方法. 1.基础 几种基础的就简单介绍一下:创建数组 var arr1 = new Array(); //括号可 ...

  8. 【hdu 6351】Beautiful Now

    [链接] 我是链接,点我呀:) [题意] 你可以最多交换k次数字. 让你组成一个最大的和一个最小的数字. [题解] 直接写个bfs.求出所有状态的最小交换次数. 但是最大值和最小值分开写. 做最大值的 ...

  9. 最小割Stoer-Wagner算法

    最小割Stoer-Wagner算法 割:在一个图G(V,E)中V是点集,E是边集.在E中去掉一个边集C使得G(V,E-C)不连通,C就是图G(V,E)的一个割: 最小割:在G(V,E)的所有割中,边权 ...

  10. Struts2校验

    struts2校验有两种实现方法: 手工编写代码实现(基本验证) //login.jsp <font color="red"><s:fielderror/> ...