흔한 이벤트 대상

2066 단어
이벤트는 이벤트의 상태를 나타낸다. 예를 들어 이벤트 대상을 촉발하는 요소, 마우스의 위치와 상태, 누르는 키 등이다.이벤트 대상은 이벤트가 발생하는 과정에서만 유효하게 호환 처리됩니다:
    box.onclick=function(ev){
        var ev=ev||window.event
    }

이벤트 위임


1. 사건 의뢰가 무엇인지: 통속적으로 말하면 사건은 onclick, onmouseover, onmouseout이다. 등이 바로 사건이다. 의뢰는 다른 사람이 하는 것이다. 이 사건은 원래 어떤 요소에 추가된 것이지만 당신은 다른 사람에게 추가되어 이 사건 원리를 완성한다. 거품이 생기는 원리를 이용하여 사건을 부급에 추가하여 집행 효과를 촉발한다.장점: 성능 향상 target 이벤트 속성 이벤트의 대상 노드(이 이벤트를 트리거하는 노드)//Firefox/Chrome/Opera/Safari srcElement 이벤트 속성 이벤트를 트리거하는 대상 노드(이 트리거하는 노드)//ie 호환 처리
oUl.onmouseover = function(ev){
    var ev = ev || window.event;
    var target = ev.target || ev.srcElement;
    
    if(target.nodeName.toLowerCase() == "li"){
            target.style.background = "red";
        }
  }

사건이 터지다


거품이 생기면 내부 원소의 사건이 먼저 촉발된 다음에 외부 원소를 촉발한다.

방법:

stopPropagation()  ; //Firefox/Chrome/Opera/Safari
cancelBubble = true  ; //ie

거품 호환 방지 처리:

function stopPropagation(e) {  
    e = e || window.event;  
    if(e.stopPropagation) {  //Firefox/Chrome/Opera/Safari   
        e.stopPropagation();  
    } else {  
        e.cancelBubble = true;  //ie  
    }  
}  

브라우저 기본 비헤이비어 차단


방법:

 preventDefault() //Firefox/Chrome/Opera/Safari
 returnValue = false  //ie

호환성 처리:


function stopPropagation(e) { e = e || window.event; if(e.preventDefault) {//Firefox/Chrome/Opera/Safari e.preventDefault(); } else { e.returnValue = false;//ie } }

마우스, 키보드 속성


altKey 이벤트 속성이 부울 값을 반환합니다.지정한 이벤트가 발생할 때 Alt 키가 눌려 있고 유지되는지 표시합니다.shiftKey 이벤트 속성이 부울 값을 반환합니다.지정한 이벤트가 발생할 때 Shift 키가 눌리고 유지되는지 표시하기;ctrlKey 이벤트 속성이 부울 값을 반환합니다.지정한 이벤트가 발생할 때 Ctrl 키가 눌려서 유지되는지 표시합니다.clientX는 이벤트가 터치되었을 때 마우스 포인터의 수평 좌표를 되돌려줍니다.clientY는 이벤트가 터치되었을 때 마우스 포인터의 수직 좌표를 되돌려줍니다.screenX는 이벤트가 터치되었을 때 화면의 수평 좌표를 기준으로 마우스 포인터를 되돌려줍니다.screenY는 이벤트가 터치되었을 때 화면의 수직 좌표를 기준으로 마우스 포인터를 되돌려줍니다.

좋은 웹페이지 즐겨찾기