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

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

jq 点击按钮显示div,点击页面其他任何地方隐藏div

css .bl_rencai_32{ float: left; height: 35px; line-height: 35px; } .bl_rencai_32 >input{ width: 30px; height: 18px; padding: 0px 5px; margin-top: -3px; } .bl_rencai_32 a{ display: none; background-color: #FF6600; text-align: center; padding: 3px 8px;…

PHP——0128练习相关2——js点击button按钮跳转到另一个新页面

js点击button按钮跳转到另一个新页面投稿:whsnow 字体:[增加减小] 类型:转载时间:2014-10-10我要评论点击按钮怎么跳转到另外一个页面呢?点击图片要跳转到新的页面时,怎么做到呢?可以使用onclick=window.location=新页面来实现点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢? 这样的效果可以:onclick="window.locat…

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

js点击button按钮跳转到另一个新页面

点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢? 这样的效果可以:onclick="window.location='新页面'" 来实现. 1.在原来的窗体中直接跳转用代码如下 window.location.href="你所要跳转的页面"; 2.在新窗体中打开页面用: 代码如下 window.open('你所要跳转的页面'); window.hist…

点击页面其它地方隐藏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级事件规定事件流包括三个阶段,事件捕获阶段,处于目标阶段,事件冒泡阶段,首先发…

js - 使用jquery发送前台请求给服务器，并显示数据

1.使用jquery发送前台请求给服务器,并显示数据 <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>success</title> </head> <script src="https://apps.bdimg.com/libs/jquery/2.1.4…

vue中超简单的方法实现点击一个按钮出现弹框，点击弹框外关闭弹框

效果图展示: View层 <template> <div> <div class="mask" v-if="showModal" @click="showModal=false"></div> <div class="pop" v-if="showModal"> <button @click="showModal=false&quo…

H5点击不同按钮跳转显示不同分页

预期效果(页面1): 点击后显示对应的内容(页面2): HTML(页面1): 添加 onclick 跟 data-index  <div class="member_box3"> <div class="member_box3_top"> <div class="member_box3_top_left">我的订单&…

js、jQuery 获取文档、窗口、元素的各种值

基于两年开发经验,总结了 javascript.jQuery 获取窗口.文档.元素的各种值 javascript: 文档:是整个document所有的内容浏览器当前窗口文档body的宽度: document.body.clientWidth;(仅仅是body的width)浏览器当前窗口文档body的高度: document.body.clientHeight;(仅仅是body的height) 浏览器当前窗口文档body的宽度: document.body.offsetWidth;(width+…

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;"&…

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

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

vue实现点击目标元素外页面的其他地方隐藏弹窗。

方法: 步骤1:给页面最外出的元素div加点击事件:@click=“popShow = false”. 步骤2:给点击目标元素加点击事件:@click=“popShow = true”. 备注:popShow 为控制弹窗显示与隐藏的标志.…

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

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

jQuery点击div其他地方隐藏div

$(document).bind("click",function(e){ var target = $(e.target); ){ $("#regionlist").hide(); } })…

jq实现元素显示后点击页面的任何位置除元素本身外隐藏元素

$(".share-weixin").on("click",function(e){ var $wx=$(".weixin-share"),_winW=$(window).width(),_winH=$(window).height(),_winScrollT=$(window).scrollTop(),_winScrollL=$(window).scrollLeft(); $wx.css({"display":"b…

点击其他地方隐藏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元素菜单

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

js jQuery显示隐藏div的几种方法

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/qq_36135335/article/details/82754202 <div id="demo">AAA</div>JS隐藏和显示div的方式有两种:方式1:隐藏后释放占用的页面空间通过设置display属性可以使div隐藏后释放占用的页面空间.style="display: none;&q…

点击页面任何位置隐藏div

<include file="Public:header" /> <style type="text/css"> table{width:100%;margin: 0;} </style> <script type='text/javascript' src="/{:APP_PATH}/Public/js/unslider.min.js"></script> <script typ…

js和jquery触发按钮点击事件

js触发按钮点击事件 function load(){ //下面两种方法效果是一样的 document.getElementById("target").onclick(); document.getElementById("target").click(); } 备注: 1.btnObj.click()是真正地用程序去点击按钮,触发了按钮的onclick()事件,按钮不隐藏的时候是可以调用的按钮隐藏之后就不行了,设定隐藏不要使用Visiable属性,使用style…

用 JS 点击左右按钮使图片切换 - 最精简版-ljx2380000-ChinaUnix博客

body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI",Tahoma,Helvetica,Sans-Serif,"Microsoft YaHei", Georgia,Helvetica,Arial,sans-serif,宋体, PMingLiU,serif; font-size: 10.5pt; line-height: 1.5;…

jQuery实现按钮5秒后可以点击

废话少说,直接上代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>按钮5秒后可以点击</title> <script type="text/javascript" src="js/jquery.min.js"> </script> <script > setTim…

js点击button按钮跳转到页面代码

点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢? 这样的效果可以:onclick="window.location=’新页面’" 来实现. 1.在原来的窗体中直接跳转用代码如下复制代码 window.location.href="你所要跳转的页面"; 2.在新窗体中打开页面用: 代码如下复制代码 window.open('你所要跳转的页面'); w…

使用JS或jQuery模拟鼠标点击a标签事件代码

原文使用JS或jQuery模拟鼠标点击a标签事件代码这篇文章主要介绍了使用JS或jQuery模拟鼠标点击a标签事件代码,需要的朋友可以参考下 <a id="alink" href="abc.aspx" style="visibility: hidden;">下一步</a> $("#alink").click(); // 触发了a标签的点击事件,但是没有触发页面跳转 document.getEleme…

JS 点击复制按钮将文字复制到手机剪贴板

我们在制作移动端网页的时候,经常会遇到这样一个问题,如何点击一个"复制"按钮,把一串文字复制到手机剪贴板,如上图所示. 看了网上的一些方法后,感觉那些方法都太复杂,有点要用插件,有的需要安装flash,但是这些对于手机等移动设备都不太合适,那么有没有一个简单点的办法呢? 今天,我们就来介绍一个简单实用的好方法: ①首先,我们把需要复制的部分做成一个readonly的input, ②复制按钮的id 我这里设置成:js-copy-text, ③js如下: <script> $…

js构建函数，点击按钮显示div，再点击按钮或其他区域，隐藏div

这只是一个例子,先看看效果: html代码: <nav> <span class="nav_logo"></span> <h1>云蚂客首页</h1> <button class="nav_btn"></button> <ul class="menu"> <li><a href="#">首页</a>…

原生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实现点击不同的按钮后各自返回被点击的次数

js实现点击不同的按钮后各自返回被点击的次数一.总结 1.注意:返回的不是三个按钮总的点击数,而是每一个的 2.用全局变量的话每一个按钮要多一个函数,用闭包就很方便二.js实现点击不同的按钮后各自返回被点击的次数练习3: 实例描述:点击按钮后自动弹出按钮被累计点击的次数案例要点: 理解闭包的基本用法. 三.代码截图注意:返回的不是三个按钮总的点击数,而是每一个的 <!DOCTYPE html> <html lang="en"> <head>…

【js或jquery实现点击某个按钮或元素显示div,点击页面其他任何地方隐藏div】的更多相关文章