이벤트리스너 만들기

1. HTML 태그 내에 직접 작성

마우스를 올려 보세요
-HTML 태그 내에 직접 작성하기

2. 이벤트리스너 프로퍼티에 등록

마우스를 올려 보세요. 클릭해보세요..
-이벤트리스너 프로퍼티 등록하기

addEventListener() 함수를 이용한 이벤트 등록

마우스를 올려 보세요. 클릭해보세요
- addEventListener()함수 이용

이벤트 객체 전달하기

마우스를 올려보세요. 클릭해보세요
이벤트 객체 정보:

preventDefault()를 이용한 이벤트 디폴트 행동 취소

CRIS 이동 CRIS 이동(return false) CRIS 이동(preventDefault) CRIS 이동 물어보기
수퍼마켓 주문하기


담배

이벤트 흐름 분석하기

이벤트 흐름 정보:

간단한 계산기 만들기

계산하고자 하는 수식을 입력하고 계산하기 버튼을 누르세요.

수식 :
결과:

마우스 이벤트 테스트

마우스 이벤트 테스트 마우스 이벤트 테스트

컨텍스트 메뉴 처리

이 페이지는 오른쪽 마우스 버튼 클릭이 허용되지 않습니다
이페이지는 사진 다운이 안됩니다.
barcelona

이미지의 onload 이벤트 처리


이미지 크기

.

이미지를 클릭하여 new image()로새 이미지 열기

로그인

ID:
Pass:

라디오 버튼 사용하기

서울 부산 대전 고양 파주

사용자 선택 결과:

체크박스 활용

물품을 선택하면 금액이 자동 계산됩니다.

모자 10,000
구두 50,000
가방 80,000
휴대폰 800,000
총 금액:

Select 이밴트 활용

메뉴를 선택하세요/

키 이벤트 리스너

다음 텍스트 창에 키를 눌러보세요.Alt, Shift, Ctrl 키도 사용 가능합니다.

중국집 메뉴판

주문하세여

메뉴 가격 수량 금액
짜장면
짬뽕
탕수육
합계