이 글은 JavaScript 버블링 이벤트의 사용 예(코드)를 제공합니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.
설명: 하위 요소와 상위 요소가 동일한 이벤트를 지원하는 경우 상위 이벤트가 트리거되면 하위 이벤트도 트리거되는 것을 이벤트 버블링이라고 합니다.
이벤트 버블링 취소: ev.cancelBubble = true
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
body{
background:yellow;}
div{
width:300px;
height:300px;
background:green;
}
</style>
</head>
<body onclick="di()">
<div onclick="ding()"></div>
</body >
<script>
function di(){
alert('底层')
}
function ding(e){
var ev = e|| event
// 取消事件冒泡，其实是阻止事件向下传递
ev.cancelBubble = true
alert('上层社会')
}
</script>
</html>상단 div를 클릭하면 하단 이벤트도 트리거됩니다. 버블링을 취소하려면 다음이 필요합니다: ev.cancelBubble = true
위 내용은 자바스크립트 버블링 이벤트 사용예(코드)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
