<!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-阻止冒泡，阻止默认行为的更多相关文章

  1. js阻止冒泡和默认事件

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 如何阻止冒泡&&浏览器默认行为

    摘要 很多同学对阻止事件冒泡和阻止事件默认行为容易混淆,项目中因为一些原因也需要阻止浏览器的一些默认行为,这里就简单总结一下. 阻止事件冒泡 什么是事件冒泡这里就不再赘述了,网上的文章一大把,这里就简 ...

  3. jQuery 阻止冒泡和默认事件

    jQuery event.preventDefault() 方法 event.preventDefault() 方法阻止元素发生默认的行为. 例如: 当点击提交按钮时阻止对表单的提交 阻止以下 URL ...

  4. js阻止冒泡和默认事件（默认行为）详解- jquery DefaultPrevented 函数

    <!DOCTYPE html> <html>     <head>     <meta charset="UTF-8">     & ...

  5. angular 点击事件阻止冒泡及默认行为

    经常遇到场景:多层级元素绑定ng-click 事件,则底层元素的点击事件存在冒泡现象,怎么解决? 类似原生JS ,只是语法稍有不同,如下: 阻止冒泡 $event.stopPropagation() ...

  6. Angular ngClick 阻止冒泡和默认行为

    这其实是一个很简单的问题,如果你认真查看过Angular官方的API文档,本来不想记录的.但是这个问题不止一次的被人问起,所以今天在记录在这里. 在Angular中已经对一些ng事件如ngClick, ...

  7. 基本event封装：阻止冒泡、默认事件等

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> ...

  8. vue 事件上加阻止冒泡 阻止默认事件

    重点 vue事件修饰符 <!-- 阻止单击事件冒泡 --> <a v-on:click.stop="doThis"></a> <!-- 提 ...

  9. jQuery阻止冒泡和HTML默认操作

    1:jQuery是一个快捷简便的JavaScript框架,说道框架可以直接理解为就是对原来底层的东西进行了封装使得开发者能够利用这个框架快速开发. 2:在当今的各个浏览器中都支持事件的冒泡,所谓的冒泡 ...

  10. 在javascript中的浏览器兼容问题以及兼容浏览器汇总（默认事件，阻止冒泡，事件监听。。。）以及解决方式详解

    在javascript中常见的浏览器兼容问题,以及解决方式. 在前端工作当中我们遵循这样的原则:渐进增强和优雅降级   渐进增强(progressive enhancement): 针对低版本浏览器进 ...

随机推荐

  1. 【学术篇】CF932E Team Work && bzoj5093 图的价值

    两个题的传送门 对于CF这道题, 分别考虑每种可能的集合大小, 每个大小为\(k\)的集合数量有\(\binom nk\)个, 所以最后的答案就是 \[\sum_{i=0}^n\binom{n}{i} ...

  2. vector 有点麻烦啊 能简单点么？

    #include <iostream> #include <cstdlib> #include <cstring> #include <cstdio> ...

  3. androidstudio 2.3.3 jni过程汇总（1）：1、自己编写c文件并使用（原）

    1.编写java代码,指定lib和native方法.package com.taven.myapplication; package com.taven.myapplication; import a ...

  4. 运行连接Oracle数据库时，Idea报错: Error : java 不支持发行版本5

    按照上面的截图步骤,一步步往下走,再运行程序时就不会报错了. 原文链接:https://blog.csdn.net/qq_22076345/article/details/82392236 感谢原文作 ...

  5. openwrt ssh免密登录

    1 生成相关秘钥 dropbearkey -t rsa -f id_rsa dropbearkey -y -f id_rsa | grep "^ssh-rsa" >> ...

  6. 预处理+状态压缩+剪枝——codefoece 1209E

    那一步剪枝实在是没想到 #include<bits/stdc++.h> using namespace std; #define N 2005 struct Col{ ],Max[< ...

  7. 排序+并查集——cf1213F

    /* 有向边(pi,pi+1),形成链后进行dfs,求出dfs序 一个联通块内的元素必须是同一个字符,如果最后的联通块个数<k,说明不行 */ #include<bits/stdc++.h ...

  8. RzGroupBar

    何分多层 procedure TForm1.FormCreate(Sender: TObject); begin RzGroup1.Items.Clear; RzGroup1.Items.Add.Ca ...

  9. 原生Ajax（ XHR 和 Fetch ）

    原生Ajax 基本使用的四大步骤,简单易懂 ajax(异步javascript xml) 能够刷新局部网页数据而不是重新加载整个网页.接下来通过本文给大家介绍Ajax的使用四大步骤,非常不错,感兴趣的 ...

  10. PHP base64_decode+gzinflate压缩和解密代码图文教程

    今天碰到的这个问题,是我在更换一个WP主题是遇到.目前的情况如下,我想要把如下的超链接去掉,后台代码找到了在sidebar1.php文件中. 打开此文件发现是一长串的字符: 经过百度.google后, ...