이벤트가 몇번째 단계에서 실행되는지 확인하는 스크립트를 작성해보자.
event.eventPhase : 이벤트가 몇번째 단계에서 실행되는지
event.target : 이벤트가 어디에서 실행되는지
event.type : 이벤트가 실행된 객체의 타입
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery event handling sample</title>
<script src="../../js/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function () {
$("#btn").on("click", function () {
console.log("현재 이벤트 단계 : ", event.eventPhase);
console.log("이벤트 타겟 : ", event.target);
console.log("이벤트 타입 : ", event.type);
alert("안녕하세요");
});
});
</script>
</head>
<body>
<input type="button" value="button" id="btn">
</body>
</html>
728x90
반응형
'HTML > Javascript 기초' 카테고리의 다른 글
[Javascript] 이벤트 제한하기 (0) | 2020.08.05 |
---|---|
[Javascript] 이벤트 중복 실행 방지하기 (0) | 2020.08.05 |
[Javascript] 이벤트 흐름 (0) | 2020.08.05 |
[Javascript] 메뉴 페이지 만들기 실습 (feat. Javascript, jQuery) (0) | 2020.08.05 |
[Javascript] 해당 속성 변경하기 (0) | 2020.08.04 |