jQuery 取消事件冒泡 阻止后续内容执行 闭包函数 (学习笔记)
1.取消事件冒泡
<title>取消事件冒泡</title>
<style>
div {
border:solid 1px black;
}
</style>
<script src="js/jquery-3.1.1.js"></script>
<script>
$(function () {
$("#big").click(function () {
alert("点了大箱子");
});
$("#small").click(function () {
alert("点了小箱子");
event = event || window.event
if (event.stopPropagation) {
//IE浏览器
event.stopPropagation();
} else {
//非IE浏览器
event.cancelBubble = true;
}
});
});
</script>
</head>
<body>
<div id="big" style="height:500px; width:500px; background-color:yellow">
<div id="small" style="height:300px; width:300px; background-color:blue"></div>
</div>
效果如下 没有取消事件冒泡的情况下点击小div会继续弹出"点了大箱子"的提示
取消后就不会了
=_=
2.取消后续内容执行
<title>取消后续内容执行</title>
<script src="js/jquery-3.1.1.js"></script>
<script>
$(function () {
$("a").click(function () {
//return false;
//分浏览器
event = event || window.event;
if (event.preventDefault) {
//IE下
event.preventDefault();
} else {
//非IE下
event.returnValue = false;
}
});
});
</script>
</head>
<body>
<a href="www.baidu.com" style="font-size:30px">去百度</a>
</body>
这样的代码 点击上面的"去百度"按钮 并不会跳转页面
因为取消了后续的事件
3.闭包函数
函数内在包含子函数，并最终return子函数。
闭包函数有什么用？
1、缓存：最显而易见的好处，就是可以实现数据缓存，我们可以把一个需要长期用到的变量设为闭包函数的局部变量，在子函数里面直接使用它。因此局部变量只定义初始化一次，但我们可以多次调用子函数并使用该变量。这比起我们在子函数中定义初始化变量，多次调用则多次初始化的做法，效率更高。闭包函数常见的一种用途就是，我们可以通过此实现计数功能。在闭包函数定义一个计数变量，而在子函数中对其进行++的操作。这样每次调用闭包函数，计数变量就会加1。
2、实现封装：如同前面所说，闭包函数就如同一个“类”，只有在该闭包函数里的方法才可以使用其局部变量，闭包函数之外的方法是不能读取其局部变量的。这就实现了面向对象的封装性，更安全更可靠。
<script type="text/javascript">
function outside(x) {
x = x * 2;
function inside() {
x++;
return x;
}
return inside();
} alert(outside(2));
</script>
结果是 弹出消息框上提示数字 5
jQuery 取消事件冒泡 阻止后续内容执行 闭包函数 (学习笔记)的更多相关文章
- JQuery阻止事件冒泡---阻止后续代码执行
(1)什么是事件起泡 首先你要明白一点,当一个事件发生的时候,该事件总是有一个事件源,即引发这个事件的对象,一个事件不能凭空产生,这就是事件的发生. 当事件发生后,这个事件就要开始传播.为什么要传播呢 ...
- jquery取消事件冒泡的三种方法展示
jquery取消事件冒泡的三种方法展示 html代码 <!doctype html> <html> <head> <meta charset="ut ...
- jquery取消事件冒泡的三种方法(推荐)
1.通过返回false来取消默认的行为并阻止事件起泡. jQuery 代码: ? 1 2 3 4 5 6 7 8 9 10 11 $("form").bind( "s ...
- jquery取消事件冒泡和取消默认行为
$('button').click(functon(e){ /*code*/ e.stopPropagation();//取消事件冒泡 e.preventDefault();//取消默认行为 })
- jquery防止事件冒泡和取消默认行为案例
----------------js取消事件冒泡: window.event.cancelBubble=true; --------------jquery事件参数可以防止事件冒泡: $(" ...
- js /jquery停止事件冒泡和阻止浏览器默认事件
1>js阻止冒泡事件 var el = window.document.getElementById("a"); el.onclick = function (e) { // ...
- js 停止事件冒泡 阻止浏览器的默认行为（阻止超连接 # ）
在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 1..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器if ( ...
- js 停止事件冒泡 阻止浏览器的默认行为
在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 浏览器默认行为: 在form中按回车键就会提交表单:单击鼠标右键就会弹出context menu. ...
- JQuery中事件冒泡
JQuery中事件冒泡 定义 在一个对象上触发某类事件,就会执行此事件程序,如果没有处理事件就会向这个对象的父级对象传播 直至它被处理,最顶层老大为document对象. 作用 事件冒泡允许多个操作被 ...
随机推荐
- Java多线程之并发协作生产者消费者设计模式
两个线程一个生产者个一个消费者 需求情景 两个线程,一个负责生产,一个负责消费,生产者生产一个,消费者消费一个 涉及问题 同步问题:如何保证同一资源被多个线程并发访问时的完整性.常用的同步方法是采用标 ...
- AndroidManifest.xml的android:name是否带.的区别
android项目里面的AndroidManifest.xml,会有这样的定义 <activity android:name=".Main" ...
- Android开发:程序目录结构详解
HelloWorld程序的目录结构概述 我们可以在文件夹中看到,HelloWorld程序的目录主要包括:src文件夹.gen文件夹.Android文件夹.assets.res文件夹. AndroidM ...
- qt 环境下mapx组件的鼠标跟踪
经过两天的研究mapx组件人坐标转换还是没有转换成功,因为不管怎么变,定点转换的经纬度坐标始终与期望的值有较大的偏差.最后还是想老大请教了一下,划了半天功夫就研究出来了(不愧是老大,仰慕之情犹如滔滔江 ...
- 百度echart使用心得，百度图表。
百度echart算是百度针对数据展示做的一个图表插件吧,一般我们使用都不是问题,主要还是对于对动态数据的解析.我这里使用饼状图,和柱状图为例: 首先,我们需要定义一个绘图的容器:(class是我自己定 ...
- MySQL的数据库，数据表，数据的操作
数据库简介 概念 什么是数据库?简单来说,数据库就是存储数据的"仓库", 但是,光有数据还不行,还要管理数据的工具,我们称之为数据库管理系统! 数据库系统 = 数据库管理系统 + ...
- Mutex
#include "stdafx.h" #include <string> #include <iostream> #include <Windows ...
- clientWidth、offsetWidth和scrollWidth的区分
scrollWidth:对象的实际内容的宽度,不包边线宽度,会随对象中内容超过可视区后而变大. clientWidth:对象内容的可视区的宽度,不包滚动条等边线,会随对象显示大小的变化而改变. off ...
- 跨域访问CORS
由于现代浏览器的同源策略,合理的跨域请求也变得至关重要. CORS(Cross-Origin Resource Sharing,跨域资源共享)定义了在必须访问跨域资源时,浏览器与服务器应该如何沟通.它 ...
- 基于mini2440的Qt移植
花了很长时间,终于把Qt移植到mini2440开发板上了,不能说完全成功,总算是完成一大步,各中过程心酸,废话不多说,下面正式讲解移植过程. 移植环境: win7系统,虚拟机是ubuntu12.04 ...