如何取消JS事件的派发——stopPropagation()

最新推荐文章于 2022-09-29 15:03:40 发布

bug师姐

最新推荐文章于 2022-09-29 15:03:40 发布

阅读量3.1k

点赞数 1

分类专栏： web前端文章标签：事件派发 JS

本文链接：https://blog.csdn.net/zcl_love_wx/article/details/51692066

版权

web前端专栏收录该内容

3 篇文章 0 订阅

订阅专栏

使用event.stopPropagation();可阻止事件的派发。
个人浅显理解派发为本次操作后面所能触发的事件将不再触发。
说明:
stopPropagation()方法将停止事件的传播，阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。注意，虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用，但是它可以阻止把事件分派到其他节点。

示例：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>

<div ng-app="myApp" ng-controller="myCtrl">
    <div ng-click="parentClick();">
        <div>父</div> <Br/><Br/><Br/><Br/>   
        <div  ng-click="childClick();">
            <div>子</div> <Br/><Br/><Br/><Br/>
            <div  ng-click="click();">孙</div>
        </div>
    </div>
</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.parentClick = function(){
        alert("父")
        event.stopPropagation();
    }
    $scope.childClick = function(){
        alert("子")
    }
    $scope.click = function(){
        alert("孙")
    }
});
</script>
</body>
</html>

bug师姐

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
如何取消JS事件的派发——stopPropagation()

使用event.stopPropagation();可阻止事件的派发。个人浅显理解派发为本次操作后面所能触发的事件将不再触发。说明: stopPropagation()方法将停止事件的传播，阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。注意，虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用，但是它可以阻止把事件分派到其他节点。示例：<
复制链接

扫一扫