>  기사  >  웹 프론트엔드  >  JavaScript Tutorial_Basics의 이벤트

JavaScript Tutorial_Basics의 이벤트

WBOY
WBOY원래의
2016-05-16 19:15:37949검색

이벤트는 JavaScript로 감지할 수 있는 동작입니다.
이벤트
JavaScript는 동적 페이지를 생성하는 기능을 제공합니다. 이벤트는 JavaScript로 감지할 수 있는 동작입니다.

웹페이지의 모든 요소는 JavaScript 기능을 실행할 수 있는 특정 이벤트를 생성할 수 있습니다. 예를 들어, 사용자가 버튼을 클릭할 때 함수를 트리거하는 onClick 이벤트를 생성할 수 있습니다. 이벤트는 HTML 페이지에 정의됩니다.

이벤트 예시:
마우스 클릭
페이지 또는 이미지 로딩
페이지의 핫스팟에 마우스 오버
양식에서 입력 상자 선택
양식 확인
키보드 키
참고: 이벤트는 일반적으로 기능과 함께 사용되며 이벤트가 발생하면 기능이 실행됩니다.

Javascript가 인식할 수 있는 이벤트에 대한 보다 포괄적인 지식이 필요한 경우 전체 "이벤트 참조 매뉴얼"을 읽어보세요.
onload 및 onUnload
onload 및 onUnload 이벤트는 사용자가 페이지에 들어오거나 나갈 때 트리거됩니다.

onload 이벤트는 방문자의 브라우저 유형과 버전을 감지한 다음 이 정보를 기반으로 웹페이지의 특정 버전을 로드하는 데 자주 사용됩니다.

onload 및 onUnload 이벤트는 사용자가 페이지에 들어오거나 나갈 때 생성된 쿠키를 처리하는 데에도 자주 사용됩니다. 예를 들어 메시지 상자를 사용하여 사용자가 페이지에 처음 들어갈 때 이름을 물어볼 수 있습니다. 이름은 쿠키에 저장됩니다. 사용자가 이 페이지에 다시 들어가면 "Welcome John Doe!"라는 또 다른 메시지 상자를 사용하여 사용자에게 인사할 수 있습니다.
onFocus, onBlur 및 onChange
onFocus, onBlur 및 onChange 이벤트는 일반적으로 양식의 유효성을 검사하기 위해 함께 사용됩니다.

다음은 onChange 이벤트를 사용한 예이다. 사용자가 필드의 내용을 변경하면 checkEmail() 함수가 호출됩니다.

onSubmit
onSubmit은 양식을 제출하기 전에 모든 양식 필드의 유효성을 검사하는 데 사용됩니다.

다음은 onSubmit 이벤트를 사용한 예입니다. 사용자가 양식에서 확인 버튼을 클릭하면 checkForm() 함수가 호출됩니다. 필드 값이 유효하지 않은 경우 제출이 취소됩니다. checkForm() 함수의 반환 값은 true 또는 false입니다. 반환 값이 true이면 양식을 제출하고, 그렇지 않으면 제출을 취소합니다.

onMouseOver 및 onMouseOut
onMouseOver 및 onMouseOut은 "동적" 버튼을 만드는 데 사용됩니다.

다음은 onMouseOver 이벤트를 사용한 예입니다. onMouseOver 이벤트가 발자국에 의해 감지되면 경고 상자가 나타납니다.

onmouseover="alert('An onMouseOver 이벤트'); return false">

JavaScript Tutorial_Basics의 이벤트

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.