728x90
반응형
<!DOCTYPE html>
<!-- src/main/webapp/20220425/event4.html -->
<html>
<head>
<meta charset="UTF-8">
<title>이벤트 취소하기</title>
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">
</script>
<script type="text/javascript">
$(function(){
//a태그 클릭시 a태그의 바탕색을 파랑색으로 변경
$("a").click(function() { //event : click 이벤트 객체
$(this).css("background", "blue")
// event.stopPropagation(); //상위 태그로 이벤트 전파 방지. a태그 클릭만 인정(h1 무시)
// event.preventDefault(); //기본이벤트 취소. a태그 클릭시 페이지 이동 무시
return false
})
$("h1").click(function(){
$(this).css("background", "red")
})
})
</script>
</head>
<body>
<h1><a href="www.kiccampus.co.kr">KIC캠퍼스</a></h1>
<h1>header</h1>
</body>
</html>728x90
반응형
'study > Jquery' 카테고리의 다른 글
| [Jquery] 21. Jquery key1 (keydown, keypress, keyup) (0) | 2022.04.25 |
|---|---|
| [Jquery] 21. Jquery exam1 (제출버튼 클릭시 입력된 이름과 비밀번호를 alert창에 띄우기) (0) | 2022.04.25 |
| [Jquery] 21. Jquery event3 (setInterval) (0) | 2022.04.25 |
| [Jquery] 21. Jquery event2 (click, hover) (0) | 2022.04.25 |
| [Jquery] 21. Jquery event1 (on, mouseenter, mouseleave) (0) | 2022.04.25 |