jQery基础，事件冒泡个默认行为stopImmediatePropagation()； preventDefault()；

于 2021-03-02 15:56:39 发布
阅读量101 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Mr_aswl/article/details/114287252
版权 
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        .father {
            width: 200px;
            height: 200px;
            background: red;
        }

        .son {
            width: 100px;
            height: 100px;
            background: blue;
        }
    </style>
    <script src="../jquery-3.3.1.js"></script>
    <script>
        $(function () {
            // $(".son").click(function (event) {
            //     alert("son");
            //     // return false;
            //     event.stopImmediatePropagation();
            // });
            // $(".father").click(function () {
            //     alert("father");
            // });


            //给a标签添加事件
            $("a").click(function(event){
                alert("弹出注册框");
                // return false;
                //event.stopImmediatePropagation();点击后回跳转
                event.preventDefault();//点击后不会跳转
            })
        })

    </script>
</head>

<body>
    <div class="father">
        <div class="son"></div>
    </div>
    <a href="https://www.bilibili.com/">bilibili干杯！</a>
    <form action="http://www.taobao.com">
        <input type="text">
        <input type="submit">
    </form>
</body>

</html>

event.stopImmediatePropagation();点击后回跳转
event.preventDefault();//点击后不会跳转
unsafe-no
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
React冒泡和阻止冒泡的应用详解
11-19
阻止事件冒泡分三种： 1：阻止合成事件往最外层document上的事件冒泡，用e.nativeEvent.stopImmediatePropagation(); 2: 合成事件间的冒泡，使用 e.stopPropagation()； 3：阻止合成事件，往处理document上的其他原生事件冒泡，需要通过e.target来判断，示例代码如下。 import React,{ Component } from 'react'; import ReactDOM,{findDOMNode} from 'react-dom'; class Counter extends Component{ const
LAMP环境搭建（M=Mongo）
满脸猪头肉
04-10 2351
LAm(mongo)P环境搭建                                                                                     ——Nerbit(181471268,[email protected])       0.       操作系统 去centos下载系统镜像CentOS-7.0-1406-x86_
return、reutrn false、e.preventDefault、e.stopPropagation、e.stopImmediatePropagation的简单使用
FavoriteStudent的博客
06-21 594
returnvar i = function(){ return } console.log(i())//undefinedreturn的主要作用是阻止函数继续执行，直接返回undefinedreturn false&lt;a class="baidu" href="http://www.baidu.com"&gt;百度&lt;/a&gt;$...
H. Safe Path
nsu_zser的博客
04-23 362
http://http://codeforces.com/gym/101755/problem/HH. Safe Pathtime limit per test2.0 smemory limit per test256 MBinputstandard inputoutputstandard outputYou play a new RPG. The world map in it is repre...
e.stopPropagation 与 e.stopImmediatePropagation的区别
tangcc的博客
03-01 5029
在vue中使用时stopImmediatePropagation可以让事件立即结束，而stopPropagation有时会循环，这点十分重要。如下示例：$(".content-ul").on("click", ".img-li", function (e) { e.stopImmediatePropagation(); if ($(".content-ul .img-li").length...
React 阻止事件冒泡失效、stopPropagation和stopImmediatePropagation分析，解决stopPropagation没有阻止冒泡问题
qssn的博客
08-20 8532
做开发中，React 和 JS 原生事件监听`addEventListener`混用了，因此发现了一个现象：React的阻止冒泡并没有阻止原生JS监听的事件触发。 下面代码的输出是（代码链接：https://codepen.io/Lik_Lit/pen/OJLROMW） “root click” “inner dom click” “document c......
jQuery事件---阻止冒泡和默认行为
热门推荐
Twilight's Blog
06-16 1万+
冒泡如果在页面中重叠了多个元素，并且重叠的这些元素都绑定了同一个事件，那么就会出现冒泡问题。例如：<body> <div style="width:300px;height:300px;background-color:skyblue;"> <input type="button" value="button"/> </div> </body>如果document、d
jQuery阻止事件冒泡
wood的博客
09-03 317
代码示例<!DOCTYPE html> <html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script src="./jquery-3.2.1.min.js"></script> <script src="./script.js"></script> </head><body>
jquery阻止默认行为_JQUERY中的事件处理：RETURN FALSE、阻止默认行为、阻止冒泡以及兼容性问题...
weixin_29124947的博客
02-26 225
在jQuery中，我们常用return false来阻止浏览器的默认行为，那”return false“到底做了什么？当你每次调用”return false“的时候，它实际上做了3件事情：event.preventDefault();event.stopPropagation();停止回调函数执行并立即返回。对，你没看错，return false确实做了这么多操作。它之所以被一再无误用，是因为使用...
jQuery 1.5 API 中文版
05-04
$.jQuery( selector [, context] ), .jQuery( element ), .jQuery( elementArray ), .jQuery( jQueryObject ), .jQuery( ) $.jQuery( html [, ownerDocument] ), .jQuery( html, props ) $.jQuery( fn ) jQuery ...
jquery需要的所有js文件
03-28
jquery需要的所有js文件 /*! * jQuery UI 1.8.18 * * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) * Dual licensed under the MIT or GPL Version 2 licenses. * http://jquery.org/license * ...
jQuery最新1.4.4精简版+1.4中文手册
12-06
jQuery是一款免费且开放源代码的JavaScript代码库，由John Resig创建。授权协议为GPL和MIT许可证双协议。 改动内容和功能增强： (New) Added a new animation method, .fadeToggle() (Enh) Calling .data() with ...
JQuery_1.4_API开发手册
12-02
jQuery是一款免费且开放源代码的JavaScript代码库，由John Resig创建。授权协议为GPL和MIT许可证双协议。 改动内容和功能增强： (New) Added a new animation method, .fadeToggle() (Enh) Calling .data() ...
Jquery——Day3（事件对象+事件冒泡+默认行为阻止）
zxy9602的博客
02-24 401
1、事件对象 即event对象，通过处理函数默认传递接受。 //通过处理函数传递事件对象； $(function(){ $("input").bind('click',function(e){ alert("欢迎光临！"); }); }); 凡是事件，都包含有属性和方法 A、event.target与event.currentTarget、relatedTarget区别： （1）
node-v6.2.0-linux-ppc64le.tar.xz
05-10
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
node-v4.7.2-linux-x86.tar.xz
最新发布
05-10
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
2024-2030中国风机盘管组市场现状研究分析与发展前景预测报告.docx
05-10
2024-2030中国风机盘管组市场现状研究分析与发展前景预测报告
node-v4.2.1-sunos-x86.tar.xz
05-10
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
stopimmediatepropagation
03-16
stopImmediatePropagation是一个JavaScript事件方法，用于阻止事件的进一步传播，并且阻止任何其他事件处理程序被调用。该方法可以在事件处理程序中使用，以确保事件只被处理一次，而不会被其他处理程序干扰。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值