实现点击页面其他地方,隐藏div(vue)
方法一:
通过监听事件
document.addEventListener('click',function(e){
if(e.target.className!='usermessage'){
that.userClick=false;
}
})
方法二(比较好):
给最外层的div加个点击事件 @click="userClick=false"
给点击的元素上面加上:@click.stop="userClick=!userClick"
实现点击页面其他地方,隐藏div(vue)的更多相关文章
- 点击页面其它地方隐藏div所想到的jQuery的delegate
在网页开发的过程中经常遇到的一个需求就是点击一div内部做某些操作,而点击页面其它地方隐藏该div.比如很多导航菜单,当菜单展开的时候,就会要求点击页面其它非菜单地方,隐藏该菜单. 先从最简单的开始, ...
- 由点击页面其它地方隐藏div所想到的jQuery的delegate
对于这个问题一般有两种思路,这两种思路都会利用事件冒泡这一原理,想要详细了解Javascript事件机制可以看看JavaScript与HTML交互——事件,这不是本文重点,所以这里只是简单介绍一下事件 ...
- jquery实现点击页面其他地方隐藏指定元素
代码实例如下: <!DOCTYPE html><html><head><meta charset=" utf-8"><meta ...
- jQuery 实现点击页面其他地方隐藏菜单
点击页面其它地方隐藏id为messageList的div 代码: $('body').delegate("#message", 'click', function(e) { var ...
- 点击页面其它地方隐藏该div的两种思路
思路一 第一种思路分两步 第一步:对document的click事件绑定事件处理程序,使其隐藏该div 第二步:对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而 ...
- 点击页面其它地方隐藏该div的方法
思路一 第一种思路分两步 第一步:对document的click事件绑定事件处理程序,使其隐藏该div 第二步:对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而 ...
- JS 实现点击页面任意位置隐藏div、span
通过调用下面的 showhidden(“标签ID”) 显示div/span/…等标签内容,可以实现点击页面任意地方再次隐藏该标签内容,而showhidden(“标签ID”,”nohidden”)可保存 ...
- 点击页面任何位置隐藏div
<include file="Public:header" /> <style type="text/css"> table{width ...
- JS如何实现点击页面其他地方隐藏菜单?
方法一: $("#a").on("click", function(e){ $("#menu").show(); $(documen ...
- jquery点击页面其他位置隐藏div
$("#btnAdd").on('click', function (e) { $("#setUp").toggle(); $(document).one('c ...
随机推荐
- hdu 1851(A Simple Game)(sg博弈)
A Simple Game Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/65535 K (Java/Others)Tot ...
- 弱校的ACM奋斗史
这是一篇老文章,不过由于无法找到最初的发文地址,这里就不能粘贴原文网址了.本站转载此文与ACMer们共勉.感谢acmerfight供稿. 题解:还记得2年前的一个晚上,我和一个女孩一起写完了这篇文章. ...
- 基于jquery的扩展写法
(function($){ $.fn.aa = function(canshu){ html = $(this).text(); alert(html) }})(jQuery); (function( ...
- 【数论数学】【P2152】【SDOI2009】Super GCD
传送门 Description Sheng bill有着惊人的心算能力,甚至能用大脑计算出两个巨大的数的GCD(最大公约 数)!因此他经常和别人比赛计算GCD.有一天Sheng bill很嚣张地找到了 ...
- HDU 1596 floyd
find the safest road Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Ot ...
- POJ2349:Arctic Network(二分+最小生成树)
Arctic Network Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 28311 Accepted: 8570 题 ...
- bzoj1026 windy数 数位DP
windy定义了一种windy数.不含前导零且相邻两个数字之差至少为2的正整数被称为windy数. windy想知道,在A和B之间,包括A和B,总共有多少个windy数? Input 包含两个整数,A ...
- 【题解】我也不是B ifrog 1112 二分 倍增
题目传送门:http://ifrog.cc/acm/problem/1112 神奇的倍增二分,长见识了,在此做个记录,分享给大家. 懒得写题解了,直接转YJQ的:http://ifrog.cc/acm ...
- [LeetCode] 9. Palindrome Number ☆
Determine whether an integer is a palindrome. Do this without extra space. Some hints: Could negativ ...
- #应用openxml读写excel代码
这个例子比较简单,没有考虑格式之类的问题. using DocumentFormat.OpenXml.Packaging; using DocumentFormat.OpenXml.Spreadshe ...