元素设置为display:none，其绑定的事件仍存在
该文章在2020年1月份进行了重写，文章地址: html元素设置display为none，绑定的事件还存在么
----------------------------------------------------------------------------------------------------------------------------------------------------------
以下是2016年的旧文
元素设置为display:none，虽然该元素从页面中消失了，其绑定的事件仍存在。
<body>
<button class="button1">change1</button>
<button class="button2">change2</button>
<button class="button3">change3</button>
<div class="test" style="width:50px;height:50px;background-color: red;"></div>
<script>
$(function () {
$('.button1').toggle(function() {
$('.test').css('background-color', 'black');
},function () {
$('.test').css('background-color', 'red');
});
$('.button2').click(function() {
$('.test').hide();
});
$('.button3').click(function() {
$('.test').show();
});
})
</script>
</body>
上图是初始页面。change1可以使div在红色和黑色切换，当点击change2时，div消失，然后点击change1,那这次点击能否是消失的div颜色变化呢？揭晓答案，最后，我们点击change3使div出现，发现消失的div颜色变了。所以结论是，元素设置为display:none，其绑定的事件仍存在。
元素设置为display:none，其绑定的事件仍存在的更多相关文章
- 使用 jQuery 选择器获取页面元素，然后利用 jQuery 对象的 css() 方法设置其 display 样式属性，从而实现显示和隐藏效果。
查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果. 具体要求如下: ...
- 小程序scroll-view组件使用时，子元素虽设置样式display:inline-flex;whit-space:nowrap
小程序scroll-view组件使用时,子元素虽设置样式display:inline-flex;whit-space:nowrap
- IE6、7下块级元素设置display:inline-block不换行的解决办法
使用背景 在实际的工作中,我们有的时候会把块元素设置为inline-block,这样做的目的有2个,一是块元素能够排列到一行,二是块元素就形成包裹性,能够自适应content area,而不必设置宽和 ...
- 解决设置了display:none的元素，会先展示再隐藏
问题:元素明明设置了display:none,但是在刷新页面的时候却会先显示了出来,然后才会隐藏,实现display:none 原因:由于元素渲染的时候,样式还没有应用上去,导致的 解决办法:使用内联 ...
- 黑马vue---16、vue中通过属性绑定为元素设置class类样式
黑马vue---16.vue中通过属性绑定为元素设置class类样式 一.总结 一句话总结: 这里就是为元素绑定class样式,和后面的style样式区别一下 vue中class样式绑定方式的相对于原 ...
- 若块级元素被设置为 display: table-cell 便无法设置宽度
工作中,遇到表格的单元格中的 div 设置宽度无效,后来是发现 div 被设置为 display: table-cell ,后将其修改为 display: block 则设置的宽度生效.
- from表单、css选择器、css组合器、字体样式、背景属性、边框设置、display设置
目录 一.form表单 1.form表单功能 2.表单使用原理 二.前端基础之css 1.关于css的介绍 2.css语法 3.三种编写CSS的方式 3.1.style内部直接编写css代码 3.2. ...
- CSS HTML元素布局及Display属性
本篇文章主要介绍HTML的内联元素.块级元素的分类与布局,以及dispaly属性对布局的影响. 目录 1. HTML 元素分类:介绍内联元素.块级元素的分类. 2. HTML 元素布局:介绍内联元素. ...
- 解决子元素设置margin-top，效果到父元素上的问题
有时当我们设置子元素的margin-top,但是却发现子元素没有出现上外边距的效果,反而是父元素出现了上外边距的效果. 这种问题的解决方法如下: 1.给父元素加边框. 2.给父元素设置padding- ...
随机推荐
- 安卓奇葩问题之.so库加载不了
真是哔了狗了. 今天突然遇到一个问题:之前用第三方的密码控件,给了一个.so库文件.然后我就放在了/jniLibs/armeabi目录下. 运行,一切都很OK. 然后重点来了.N天之后的今天,突然打包 ...
- 【分块打表】bzoj3758 数数
验证一个数是不是优美的:设数位之和为sum,若sum mod 2 != 0,则不优美.否则考虑枚举这个数的每一位,将之前所有位任意相加产生的所有 数字和 和 当前位 的和塞到集合里,最终判断集合中是否 ...
- .Net Webconfig连接字符串中数据库实例名带'\'的问题
获取前: 获取后: 导致sa登录失败的问题 string strCon = "workstation id=localhost;packet size=4096;user id=" ...
- H3C IRF mad检测
这里 irf 两个交换机 S4 S5 S4 S4的MEmber id 为1 IRF member 1 renumber 1 S4的 irf 优先为10 irf member priority 10 链 ...
- H 1022 Train Problem Ⅰ
题意:给我们两个序列,看能否通过压栈,出栈将第一个序列转换成第二个. 思路:将序列 1 依次压栈,同时看是否和序列 2 当前元素相同 代码如下: #include<iostream> #i ...
- 结对开发训练（郭林林&胡潇丹）
此次编程题为:求一个整数数组最大子数组之和,要求时间复杂度为O(n). 首先,我们对题目做出分析,做出第一种预行方案,即定义一个数组,当数组中元素大于等于0时,进行累加:若小于0,则与后面的数作比较, ...
- 20145301&20145321&20145335实验四
20145301&20145321&20145335实验四 这次实验我的组员为:20145301赵嘉鑫.20145321曾子誉.20145335郝昊 实验内容详见:实验四
- 利用html5 canvas实现纯前端上传图片的裁剪
今天跟大家分享一个前端裁剪图片的方法.许多网站都有设置用户头像的功能,用户可以选择一张本地的图片,然后用网站的裁剪工具进行裁剪,然后设置大小,位置合适的头像.当然,网上也有一些用js写的诸如此类裁剪的 ...
- 本地推送UILocalNotification
//本地推送---无需网络,由本地发起 UILocalNotification *localNotification = [[UILocalNotification alloc]init]; //设置 ...
- 关于FluentNhibernate数据库连接配置，请教
在用FluentNHibernate映射数据库,出现这个问题,一天多了也没解决,求各位大神支招 问题是与map对应的表已成功创建,出错的地方是最后的 .BuildSessionFactory(); ...