컴퓨터 언어/Script

자바스크립트 Focus 핸들처리 - Document.hasFocus()

cepiloth 2018. 12. 3. 14:34
728x90

Document.hasFocus() 메소드는 문서 또는 문서 내의 요소(element) 중 어느 하나라도 포커스(focus)를 갖고 있으면 true, 그렇지 않으면 false인 Boolean 값을 반환한다. 이 메소드를 사용하여 문서내 활성화된(active) 요소가 포커스를 갖고 있는지 판단할 수 있다.

문서를 볼 때, 포커스를 가진 요소는 언제나 문서상의 활성화된 요소이다. 반면에 활성화된 요소는 꼭 포커스를 갖지 않을 수 도 있다. 예를 들면 전면에 나와있지 않은(not a foreground) 팝업창 내의 활성화된 요소는 포커스를 갖고 있지 않다.

문법EDIT

focused = document.hasFocus();

반환값

문서 내의 활성화된 요소가 포커스를 갖고 있지 않으면 false를 반환, 포커스를 갖고 있다면 true를 반환

예시EDIT

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>TEST</title>
<style>
#message { font-weight: bold; }
</style>

<script>

setInterval( CheckPageFocus, 200 );

function CheckPageFocus() {
  var info = document.getElementById("message");

  if ( document.hasFocus() ) {
    info.innerHTML = "The document has the focus.";
  } else {
    info.innerHTML = "The document doesn't have the focus.";
  }
}

function OpenWindow() {
  window.open (
    "http://developer.mozilla.org/",
    "mozdev",
    width=640,
    height=300,
    left=150,
    top=260
  );
}

</script>
</head>

<body>
  <h1>JavaScript hasFocus example</h1>
  <div id="message">Waiting for user action</div>
  <div><button onclick="OpenWindow()">Open a new window</button></div>
</body>
</html>

명세EDIT

SpecificationStatusComment
WHATWG HTML Living Standard
The definition of 'Document.hasFocus()' in that specification.		Living StandardInitial definition

브라우저 호환성EDIT

FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support303.0 (1.9)6.0Not supported(Yes)
FeatureAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Basic support?1.0 (1.9)?Not supported?

관련 참고EDIT


728x90
반응형