자바스크립트 델리게이트(Delegate) 블러 및 포커스 사용 예시 분석_자바스크립트 기술

이 글의 예시에서는 자바스크립트 델리게이트(Delegate) 블러와 포커스 사용법을 설명하고 있습니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다.

Opera(9.5b)는 모든 초점 및 흐림 이벤트에 대해 올바르게 두 번 트리거할 수 없습니다.
따라서 포커스 및 흐림 이벤트에 대한 핸들러는 이벤트의 캡처 단계에 위임될 수 있습니다.

예 1(목록 클래스):

코드 복사 코드는 다음과 같습니다.

1. 목록 항목 1>
   
   
   ~ ;; ;;
   
   기타 목록 항목
   
   
   
   예 2(양식 클래스):

코드 복사 코드는 다음과 같습니다.

기타 양식 항목

여기서 모니터링하는 것은 가장 바깥쪽 ol 블록입니다. 블러 및 포커스 이벤트를 사용하면 ol 전체에 대해서만 적용됩니다. 그러면 내부 컨트롤의 포커스 및 블러 이벤트를 어떻게 처리해야 할까요?

처리방법은 다음과 같습니다.

IE 처리:

코드 복사 코드는 다음과 같습니다.$('list').onmouseover = handlerMouseOver; $('list').onmouseout = handlerMouseOut;

$('List').onfocusin = handlerMouseOver;

$('List').onfocusout = handlerMouseOut;


은 다음과 같은 형식으로도 쓸 수 있습니다.

코드 복사 코드는 다음과 같습니다.$('list').attachEvent('onfocusout',handleMouseOut, 사실);

매개변수를 전달하려는 경우

와 같은 중간 기능을 추가할 수 있습니다.

코드 복사 코드는 다음과 같습니다.$('list').attachEvent('onfocusout',function( 이벤트, myparams ){handleMouseOut(event, myparams);},true);

FF 처리:

코드 복사 코드는 다음과 같습니다.$('list').addEventListener('focus',handleMouseOver, 사실) $('list').addEventListener('blur',handleMouseOut,true);

이 기사가 모든 사람의 JavaScript 프로그래밍 설계에 도움이 되기를 바랍니다.