vue点击其它地方菜单消失

2024-11-07

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

需求是通过点击body页面,在其他地方就关闭这个<div>菜单,给这个div一个id:problemList,但是点击我打开的按钮,不关闭. created () { document.onclick = function () { // 要关闭的div的id (problemList) document.getElementById('problemList').style.display = 'none' } }, 点击按钮打开模态框的方法要写个阻止冒泡事件,不然会点不开 getItme(

vue 点击其他地方隐藏dom

document.addEventListener('click', function (e) { if (document.getElementsByClassName('keywordContainer')[0]) { if (!document.getElementsByClassName('keywordContainer')[0].contains(e.target)) {//这句话是说如果我们点击到了class为keywordContainer以外的区域 app.isShowItem

vue 点击任意地方防止冒泡

$('.mainL').mouseup(function(e){ let objLeader = $(obj.target); // 设置目标区域 if(!objLeader.is(e.target) && objLeader.has(e.target).length === 0){ // 判断是不是目标区域 $(objLeader).css({'border':'0rem solid #F2CB80'}) } });

jquery 点击其他地方

点击其它位置，div下拉菜单消失

接下拉菜单那一篇: 加上点击其它位置,下拉菜单消失. 纯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' ) { retur

vue点击除了某组件本身的其它地方, 隐藏该组件的方法

点击emoji表情标签, 出现标签组件,点击其它地方, 改组件消失的效果; <template> <div class="writeZoon"> <div class="top"> <span class="icon iconfont icon-smiling" @click.stop="emojiShow"></span> //1 绑定点击事件 <span c

vue点击出现蒙版

需求: 1.点击一个事件时弹出一个蒙版: 2.蒙版上有取消,删除事件:(点击取消时候蒙版消失,点击删除时,删除蒙版并消失): 3.点击空白地方,蒙版也消失: <template> <div class="waitPay"> <div class="logo"> <span></span> <span>保单号{{acc

关于protel 99se 汉化后某些菜单消失的解决方法

本人在使用protel 99se 画PCB时,遇到了好些问题,通过网上查资料基本都解决了. 下面给大家分享关于protel 99se 汉化后某些菜单消失的解决方法. 其他的许多看不见的菜单也可以自己通过下面的方法调用出来. 记得自己刚毕业那会用软件总是喜欢用中文版的,到处找什么“汉化”补丁之类.原以为这样能对软件的使用有更加清晰的认识,其实这样反而会更加麻烦.首先这不同的翻译者对同一个英文单词的翻译是不一样的,更何况专业英语单词,那可真是五花八门.二来真正用软件工具熟练的工程师基本上就是用的英

Jquery手机点击其他地方隐藏控件问题

因为不太懂mui的底部导航栏的操作,所以自己写了用很普通的方法实现手机底部导航栏,遇到了很多问题.比如:要实现点击底部菜单栏上某一个菜单,显示子菜单,然后点击手机空白处,隐藏菜单. 实现方法是: //点击其他地方隐藏下拉菜单 document.onclick = function(){ $("#defaultTab_submenu").hide(); $("#wgmenu_submenu").hide(); $("#zcmenu_submenu"

点击其它地方隐藏div／事件冒泡／sweet－alert阻止冒泡

点击document时把div隐藏,但点击div时阻止点击事件冒泡到document,从而实现“点击文档其它地方隐藏div,点击div本身不隐藏”.js代码如下:$("#div").click(function(e){ e.stopPropagation();});$(document).click(function(){ $("#div").hide();});实现了点击其它地方隐藏div后遇到了另一个问题.我的div内部使用了bootstrap的tab组件,di

GridView点击空白地方事件扩展

我们通常在ListView或者GridView响应点击Item事件,但很多时候我们同样也希望监听到点击空白区域的事件来做更多的处理.本文以GridView为例给出一个实现的方法,扩展GridView并可作为通用控件使用.ListView的实现应该也大同小异好吧,原来之前写过另外一篇,不过监控的是ACTION_UP事件,但这篇更加通用代码比较简单,先贴代码再做下解释 public class MyGridView extends GridView { public interface On

ios王云鹤--iPhone中，点击换行，键盘消失。

1.要在声明文件中实现 UItextFieldDelegate 协议 2.在实现文件中实现 UItextFieldDelegate 协议中键盘消失的方法即: -(BOOL)textFieldShouldReturn:(UITextField *)textField{ [textField resignFirstResponder]; return YES; } 3.在viewDidLoad方法中添加代理(光标在哪停留就添加哪些)例如: -(void)viewDidLoad{ [super vi

java Swing 如何添加点击可展开菜单控件( JMenuBar如何使用？）

准备: JMenuBar 点击可展开控件本体 JMenu 点击可展开控件中的一级菜单 JMenuItem 点击可展开控件中的二级菜单 JFrame 程序运行时弹出的那个框框这是一个使用点击可展开菜单控件的例子. package swing; import java.awt.EventQueue; import javax.swing.JFrame; import javax.swing.JMenu; import javax.swing.JMenuBar; import javax.swin

【vue】iView-admin2.0动态菜单路由

vue项目实现动态路由有俩种方式一.前端在routers中写好--所有--路由表 <前端控制路由>,登录时根据用户的角色权限来动态的显示菜单路由二.前端通过调用接口请求拿到当前用户--对应权限的--路由表 <后端处理路由返回>,以动态的显示菜单路由介绍第二种 (参考资料) 左侧菜单可通过 ①本地mock假数据 ②easymock假数据 ③从后台请求返回的数据方式之一请求而来介绍方式①本地mock假数据 1.iview-admin的src->mock->da

vue 点击当前元素添加class 去掉兄弟的class 获取当前点击元素的文字

点击当前标签给其添加class,兄弟标签class删除然后获取当前点击元素的文字演示地址: https://xibushijie.github.io/static/addClass.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>vue 点击当前元素添加class 去掉兄弟的class</title> <script src

js点击出现二级菜单，点击二级菜单主菜单换成二级菜单

点击出现二级菜单 *{ margin:0px auto; padding:0px; } .yiji{ width:200px; height:40px; background-color:red; color:#fff; text-align:center; line-height:40px;h vertical-align:middle; border:1px solid #FFF; } .erji1{ width:200px; height:40px; background-color:#F

多行文本文本输入框 textarea 可点击任意地方编辑的问题

遇到了一个问题: textarea可以点击任意地方编辑原因: textarea中间我换行了改成: 就正常了.

VUE 打包后关于 -webkit-box-orient: vertical; 消失，导致多行溢出不管用问题

VUE 打包后 -webkit-box-orient: vertical; 样式消失,导致页面样式爆炸,看了看解决方案,在这里总结一下: 实际上是 optimize-css-assets-webpack-plugin 这个插件的问题,在打包的时候,过滤了部分css,可修改此插件: 但是个人原因,本着不动原有文件的原则,更改css即可,前后分别加上一行注释,亲测可行,注意格式!!! overflow: hidden; text-overflow: ellipsis; display: -webki

vue点击返回顶部插件vue-totop

vue-totop vue 点击返回顶部插件,可以根据参数设定按钮大小,颜色,类型,返回顶部的时间等.github地址:https://github.com/1006008051/vue-totop,欢迎star. 安装npm install vue-totop -S 使用注入 // ES6import vueToTop from 'vue-totop'//or requirevar vueToTop = require('vue-totop') Vue.use(vueToTop) 组件使用 <

vue点击切换颜色限制个数（用了mui框架）

vue点击切换颜色只能点击一个 <!doctype html> <head> <meta charset="UTF-8"> <title>修改资料--类别</title> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalabl

vue 点击当前元素添加class 去掉兄弟的class

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>vue 点击当前元素添加class 去掉兄弟的class</title> <link rel="stylesheet&qu

vue点击其它地方菜单消失

热门专题