javaScript 를 이용 하여 상용 이벤트 에 대한 상세 한 설명 을 처리 합 니 다.
1.창 이벤트
예 를 들 어 onload 이벤트:페이지 가 완전히 불 러 오 면(이미지,js 파일,css 파일 등 포함)이 이벤트 가 실 행 됩 니 다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> </title>
<script>
window.onload=function(){
var mydiv = document.getElementById("mydiv");
alert(" ,mydiv :"+mydiv.innerText);
}
</script>
</head>
<body>
<div id='mydiv'> , , 。</div>
</body>
</html>
이에 대해 서 는 다음 과 같다.
resize 이벤트:브 라 우 저의 창 을 새로운 너비 나 높이 로 조정 하면 resize 이벤트 가 실 행 됩 니 다.
스크롤 이벤트:문서 나 브 라 우 저 창 이 스크롤 되 는 동안 스크롤 이벤트 가 발생 합 니 다.
초점 이벤트:텍스트 상자 에서 선택 하거나 선택 을 취소 하 는 등 요소 가 초점 을 얻 고 잃 는 것 을 말 합 니 다.
2.마우스 이벤트
예 를 들 어 왼쪽 단 추 를 누 르 면 onclick 이벤트 가 발생 합 니 다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> </title>
<style>
html,body{
width: 100%;
height: 100%;
}
</style>
<script>
function mouseclick(){
alert(' ');
}
</script>
</head>
<body onclick="mouseclick()">
<div id='mydiv'> , , 。</div>
</body>
</html>
: html body width: 100%,height: 100%, onclick 。
3.키보드 이벤트
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> </title>
<style>
html,body{
background-color: aquamarine;
width: 100%;
height: 100%;
}
</style>
<script>
function keydown(event){
if(event.keyCode==37){
alert(event.keyCode +' ');
}
if(event.keyCode==38){
alert(event.keyCode +' ');
}
if(event.keyCode==39){
alert(event.keyCode +' ');
}
if(event.keyCode==40){
alert(event.keyCode +' ');
}
}
</script>
</head>
<body onkeydown="keydown(event)">
</body>
</html>
4.상용 이벤트 방법(창 이벤트,마우스 이벤트,키보드 이벤트,텍스트 이벤트 포함)
방법.
묘사 하 다.
onabort
그림 불 러 오기 가 중단 되 었 습 니 다.
onblur
원소 초점 잃 음
onchange
사용자 변경 도 메 인 내용
onclick
대상
ondblclick
대상 을 더 블 클릭
onerror
문서 나 그림 을 불 러 오 는 중 오류 가 발생 했 습 니 다.
onfocus
원소 초점 획득
onkeydown
어떤 키보드 의 키 가 눌 렸 다.
onkeypress
어떤 키보드 의 키 가 눌 리 거나 눌 렸 다.
onkeyup
어떤 키보드 의 키 가 풀 렸 다.
onload
어떤 페이지 나 그림 이 불 러 오기 가 완료 되 었 습 니 다.
onmousedown
어떤 마우스 버튼 이 눌 렸 다.
onmousemove
마우스 가 이동 됨
onmouseout
마우스 가 원소 에서 이동 합 니 다
onmouseover
마우스 가 원소 위로 이동 되 었 습 니 다.
onmouseup
어떤 마우스 버튼 이 풀 렸 다.
onreset
리 셋 단추 가 눌 렸 습 니 다.
onresize
창 이나 프레임 크기 조정
onselect
텍스트 가 선택 되 었 습 니 다.
onsubmit
제출 버튼 이 눌 렸 습 니 다.
onunload
사용자 페이지 종료
5.사건 의 거품 과 사건 포착
사건 이 발생 하면 사건 흐름 이 발생 합 니 다.HTML 요소 가 사건 이 발생 할 때 이 사건 은 요소 노드 와 루트 노드 사이 에 특정한 순서 로 중계 되 고 전달 과 귀 환 과 유사 합 니 다.이벤트 트리거 방식 은 다음 과 같 습 니 다.addEventListener("click","doSomething","ture");세 번 째 매개 변수 일 때 ture 는 이벤트 캡 처 이 고 false 일 경우 이벤트 거품 이 발생 합 니 다.기본 값 은 거품 입 니 다.
캡 처 형 이벤트 전파:
거품 형 사건 전파
자 바스 크 립 트 를 이용 한 상용 이벤트 처리 에 대한 상세 한 설명 은 여기까지 입 니 다.더 많은 관련 js 처리 상용 이벤트 내용 은 우리 의 이전 글 을 검색 하거나 아래 의 관련 글 을 계속 조회 하 시기 바 랍 니 다.앞으로 많은 응원 부탁드립니다!