programing

포커스가있는 HTML 페이지 요소를 확인하는 방법은 무엇입니까?

nasanasas 2020. 11. 17. 08:09
반응형

포커스가있는 HTML 페이지 요소를 확인하는 방법은 무엇입니까?


중복 가능성 :
어떤 DOM 요소에 포커스가 있는지 어떻게 알 수 있습니까?

어떤 HTML 페이지 요소에 포커스가 있는지 확인하는 방법이 자바 스크립트에 있습니까?


document.activeElement속성을 사용하십시오 .

document.activeElement속성은 Chrome 2+, Firefox 3+, IE4 +, Opera 9.6+ 및 Safari 4+에서 지원됩니다.

이 속성에는 키 입력을 허용하는 요소 (예 : 양식 요소) 만 포함됩니다.


이 블로그 게시물을 확인하십시오 . document.activeElement모든 브라우저에서 작동 하도록 해결 방법을 제공 합니다.

function _dom_trackActiveElement(evt) {
    if (evt && evt.target) { 
        document.activeElement = evt.target == document ? null : evt.target;
    }
}

function _dom_trackActiveElementLost(evt) { 
    document.activeElement = null;
}

if (!document.activeElement) {
    document.addEventListener("focus",_dom_trackActiveElement,true);
    document.addEventListener("blur",_dom_trackActiveElementLost,true);
}

참고할 사항 :

이 구현은 약간 지나치게 비관적입니다. 브라우저 창이 포커스를 잃으면 activeElement가 null로 설정됩니다 (입력 컨트롤도 포커스를 잃기 때문). 브라우저 창에 포커스가 없더라도 애플리케이션에 activeElement 값이 필요한 경우 blur 이벤트 리스너를 제거 할 수 있습니다.


기록을 위해 조금 늦었고 물론 이전 브라우저에서는 지원되지 않습니다 .

var element = document.querySelector(":focus");

모든 요소 (예 : 앵커)에서 작동해야합니다.


아마도 document.activeElement브라우저 지원에 대해 모르겠습니다. Firefox와 IE7에서 작동하는 것 같지만 Opera에서도 시도 해봐야한다고 생각합니다.


하단 포스트를 확인하십시오 . 그게 효과가있을 것 같아요 ...

참고 URL : https://stackoverflow.com/questions/483741/how-to-determine-which-html-page-element-has-focus

반응형