js点击其他地方隐藏

2024-11-10

js点击页面其他地方如何隐藏div元素菜单

web页面常用的一个需求,写下拉菜单是我们往往不是用select_option,而是自定义一个元素列出选项来满足需求,当我们点击按钮出现菜单, 点击按钮或菜单以外页面空白地方隐藏该菜单,这里提供一种简单有效的方法仅供参考: document.onclick = function(e) { $("div").hide(); } $('button').on("click", function(e) { if($("#div").css("

点击其它地方隐藏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

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

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

jquery实现除指定区域外点击任何地方隐藏DIV

<div class="layui-input-block expression-box"> </div> <div class="layui-input-block" style="width: 600px; margin: 0 auto; border-left: 1px solid #4a4f58; border-right: 1px solid #4a4f58;"&

js 冒泡事件点击任意地方隐藏元素

$(function () { $("#but").click(function (e) {// $();//显示速度 /*阻止冒泡事件*/ e = window.event || e; if (e.stopPropagation) { e.stopPropagation(); } else { e.cancelBubble = true; } }); $("#UL").click(function (e) { /*阻止冒泡事件*/ e = window.event

jquery点击其他地方隐藏div层的实现程序

js代码 $(document).ready(function() { //语言头部的点击事件,显示语言列表 $(".language_selected").click(function(e) { $(".language_list").toggle(); e.stopPropagation(); //阻止事件冒泡,否则事件会冒泡到下面的文档点击事件 }); //点击文档时,隐藏语言列表 $(document).click(function() { $("

jq冒泡之——点击其他地方隐藏

e.stopPropagetion(); <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="http://cdn.bootcss.com/jquery/3.1.1/jque

一款js点击显示和隐藏的例子（pc，移动端通用）

html部分: <div id="box"> <div id="box_title">标题</div> <div id="box_content">11111111<br/>2222222<br/>333333</div> </div> css部分: <style> #box {;;width:100%;} #box_title {back

vue 点击其他地方隐藏dom

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

点击其他地方隐藏div

document.onclick = function(e){ var ele = e?e.target:window.event.srcElement; if(ele.id !== 'valueShow'){ document.getElementById("valueShow").style.display = "none"; val.style.height = '20px'; } };

原生JS实现点击一个按钮显示一个div，再点击按钮div隐藏，或点击除div外其它空白处div隐藏

<!DOCTYPE html> <html style="font-size: 24px"> <head> <title>js点击按钮显示再点击空白地方隐藏</title> <style type="text/css"> #div { border: 1px solid red; display: flex; align-items: center; justify-content: cente

js或jquery实现点击某个按钮或元素显示div,点击页面其他任何地方隐藏div

点击某个元素显示div,点击页面其他任何地方隐藏div,可用javascript和jquery两种方法实现: 一:javascript实现方法技巧<script>//定义stopPropagation 方法的使用,该方法将停止事件的传播,阻止它被分派到其他 Document 节点. function stopFunc(e) { e.stopPropagation ? e.stopPropagation() : e.cancelBubble = true; };//获取元素的

JS代码实用代码实例（输入框监听，点击显示点击其他地方消失,文件本地预览上传)

前段时间写前端,遇到一些模块非常有用,总结以备后用一.input框字数监听 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <input type="text" name="wxChoi

jquery实现点击页面其他地方隐藏指定元素

代码实例如下: <!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>点击页面其他地方隐藏div-蚂蚁部落</title><style type="text/css"&

点击div和某些控件之外的地方隐藏div，点击div不隐藏。对象 click和document click冲突有关问题

帮朋友解决这个问题,我发现用以往想想像的方式来实现,貌似不太可行,所以从网上找了一些解决办法,进行优化,这篇比较详细,所以拿来备忘,另一方面也希望可以帮助需要的同学! 问题背景:jQuery事件问题!!对象 click和document click冲突问题我想点击某个元素显示一个对象, 点击页面任意处,隐藏这个对象 //点击look对象,显示隐藏mydiv $("#look").bind("click", function () { $("#m

js进阶 12-15 jquery如何实现点击button显示列表，点击其它位置隐藏列表

js进阶 12-15 jquery如何实现点击button显示列表,点击其它位置隐藏列表一.总结一句话总结:在button中阻止事件冒泡. 1.如何咋button中阻止事件冒泡(两种方法)? event.stopPropagation()和return false 31 $("#btn").click(function(){ 32 // alert('#btn') 33 $('ul').show() 34 //event.stopPropagation() 35 return fa

android 实现点击listview 空白地方隐藏菜单

思路:重写ListView的setOnTouchListener事件: ListView.setOnTouchListener(new OnTouchListener(){ @Override public boolean onTouch(View arg0, MotionEvent arg1) { // TODO Auto-generated method stub hideMenu();//隐藏菜单 return false; } }); 延申: 点击窗体空白地方隐藏菜单或软键盘思路一样:

点击页面其它地方隐藏div所想到的jQuery的delegate

在网页开发的过程中经常遇到的一个需求就是点击一div内部做某些操作,而点击页面其它地方隐藏该div.比如很多导航菜单,当菜单展开的时候,就会要求点击页面其它非菜单地方,隐藏该菜单. 先从最简单的开始,假如页面有一个id为test的div,我们要实现点击页面其它地方隐藏该div: <div id="test" style="margin:100px;background-color:#3e3;width:100px;height:100px;"> <

由点击页面其它地方隐藏div所想到的jQuery的delegate

对于这个问题一般有两种思路,这两种思路都会利用事件冒泡这一原理,想要详细了解Javascript事件机制可以看看JavaScript与HTML交互——事件,这不是本文重点,所以这里只是简单介绍一下事件冒泡, 事件冒泡 IE的事件冒泡:事件开始时由最具体的元素接收,然后逐级向上传播到较为不具体的元素 Netscape的事件捕获:不太具体的节点更早接收事件,而最具体的元素最后接收事件,和事件冒泡相反 DOM事件流:DOM2级事件规定事件流包括三个阶段,事件捕获阶段,处于目标阶段,事件冒泡阶段,首先发

jQuery 实现点击页面其他地方隐藏菜单

点击页面其它地方隐藏id为messageList的div 代码: $('body').delegate("#message", 'click', function(e) { var e=window.event||e; //消除浏览器差异 if (!$(e.target).closest(".messageList").length) { $(".messageList").addClass("messageListShow"

js点击其他地方隐藏

热门专题