jq-demo-阻止冒泡,阻止默认行为
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id = "box" style = "width: 200px; height: 200px; background:green;">
<input type="button" value = "按钮" />
</div> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
$(function () {
$("body").click(function () {
console.log("body");
});
$("#box").click(function () {
console.log("div");
});
$("input").click(function (e) {
console.log("input"); e.stopPropagation();//阻止冒泡
console.log(e.isPropagationStopped);//true e.preventDefault()//阻止浏览器默认行为
})
})
</script>
</body>
</html>
e.stopPropagation();//阻止冒泡
console.log(e.isPropagationStopped);//true
e.preventDefault()//阻止浏览器默认行为
jq-demo-阻止冒泡,阻止默认行为的更多相关文章
- js阻止冒泡和默认事件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 如何阻止冒泡&&浏览器默认行为
摘要 很多同学对阻止事件冒泡和阻止事件默认行为容易混淆,项目中因为一些原因也需要阻止浏览器的一些默认行为,这里就简单总结一下. 阻止事件冒泡 什么是事件冒泡这里就不再赘述了,网上的文章一大把,这里就简 ...
- jQuery 阻止冒泡和默认事件
jQuery event.preventDefault() 方法 event.preventDefault() 方法阻止元素发生默认的行为. 例如: 当点击提交按钮时阻止对表单的提交 阻止以下 URL ...
- js阻止冒泡和默认事件(默认行为)详解- jquery DefaultPrevented 函数
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...
- angular 点击事件阻止冒泡及默认行为
经常遇到场景:多层级元素绑定ng-click 事件,则底层元素的点击事件存在冒泡现象,怎么解决? 类似原生JS ,只是语法稍有不同,如下: 阻止冒泡 $event.stopPropagation() ...
- Angular ngClick 阻止冒泡和默认行为
这其实是一个很简单的问题,如果你认真查看过Angular官方的API文档,本来不想记录的.但是这个问题不止一次的被人问起,所以今天在记录在这里. 在Angular中已经对一些ng事件如ngClick, ...
- 基本event封装:阻止冒泡、默认事件等
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> ...
- vue 事件上加阻止冒泡 阻止默认事件
重点 vue事件修饰符 <!-- 阻止单击事件冒泡 --> <a v-on:click.stop="doThis"></a> <!-- 提 ...
- jQuery阻止冒泡和HTML默认操作
1:jQuery是一个快捷简便的JavaScript框架,说道框架可以直接理解为就是对原来底层的东西进行了封装使得开发者能够利用这个框架快速开发. 2:在当今的各个浏览器中都支持事件的冒泡,所谓的冒泡 ...
- 在javascript中的浏览器兼容问题以及兼容浏览器汇总(默认事件,阻止冒泡,事件监听。。。)以及解决方式详解
在javascript中常见的浏览器兼容问题,以及解决方式. 在前端工作当中我们遵循这样的原则:渐进增强和优雅降级 渐进增强(progressive enhancement): 针对低版本浏览器进 ...
随机推荐
- 如何在MySQL中删除表中指定列的唯一键?
语法结构如下: alter table table_name drop index column_name;
- Lambda select 动态字段
直接上代码 //测试数据 public static List<User> myList = new List<User>() { , Name=,IsChild=false} ...
- leetcode-164周赛-1266-访问所有点的最小时间
题目描述: 自己的解: class Solution: def minTimeToVisitAllPoints(self, points: List[List[int]]) -> int: re ...
- 【LeetCode 10】正则表达式匹配
题目链接 [题解] 看到这个题解 写的代码. 就是加个备忘录法.优化一下暴力的做法. 匹配的时候如果遇到号的话,就两种可能.不再考虑它前面一个字符了. 跳过这个或者.或者继续用前面那个字符匹配. 即d ...
- 【LeetCode 2】两数相加
描述 [题解] 模拟高精度的加法. 用x来记录前面的进位就好. [代码] /** * Definition for singly-linked list. * struct ListNode { * ...
- 芜湖市2018市队选拔Day2T1
好激动啊,Day2竟然AK了! Day2T1养宠物 Descriptionbadgers是可爱的动物,Smart想拥有一些.宠物店提供N个badgers,编号为1..N,Smart都很喜欢,所以他想拥 ...
- 网关协议:CGI和WSGI
通常服务器程序分为web服务器和应用程序服务器.web服务器是用于处理HTML文件,让客户可以通过浏览器进行访问,主流的web服务器有Apache.IIS.Nginx.lighthttpd等.应用服务 ...
- word文档操作
1.如何把word文档修改的地方标记出来 : https://zhidao.baidu.com/question/73648149.html 2.word 的几种 视图:https://zhid ...
- pefile解析PE格式
import os,sys import pefile import pydasm import struct #print sys.argv def show_section(pe): print ...
- Linux启动过程的内核代码分析
参考上文: http://www.cnblogs.com/long123king/p/3543872.html http://www.cnblogs.com/long123king/p/3545688 ...