반응형
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
//event.stopPropagation
// 현재 이벤트가 상위로 전달되지 않도록 중단
$(document).ready(function() {
$("a").click(function(event) {
$(this).css("background-color", "orange");
//이벤트 전파를 막음
event.stopPropagation();
event.preventDefault();
});
$("h1").click(function() {
$(this).css("background-color", "green");
});
});
</script>
<title>Document</title>
</head>
<body>
<h1>
<a href="http://www.naver.com">Naver</a>
</h1>
</body>
</html>
반응형
'2020 > JQuery' 카테고리의 다른 글
| JQuery scroll event (0) | 2020.03.04 |
|---|---|
| JQuery 글자수 제한 (keyup, textarea, length) (0) | 2020.03.04 |
| JQuery event.preventDefault, 기본 이벤트 제거 (0) | 2020.03.03 |
| JQuery odd, even 위치 필터선택자 (0) | 2020.03.03 |
| JQuery clone(), 문서 객체 복제 (0) | 2020.03.03 |
꽃꽂이하는개발자