.focus (handler) 정보
jQuery .focus (handler)본문
.focus (handler)
설명 : 이벤트 핸들러를 "focus"JavaScript 이벤트에 바인딩하거나 요소에서 이벤트를 트리거하십시오.
이 방법은 .on( "focus", handler )첫 번째 및 두 번째 변형과 세 번째 변형 의 바로 가기입니다 .trigger( "focus" ).
focus가 포커스를 얻어하면 이벤트 요소로 전송됩니다. 이 이벤트는 이러한 형태의 소자 (AS 요소의 제한된 세트에 적용 내재적 인 <input>, <select>등), 링크 ( <a href>). 최근 브라우저 버전에서는 이벤트를 명시 적으로 요소의 tabindex속성을 설정하여 모든 요소 유형을 포함하도록 확장 할 수 있습니다 . 요소는 Tab 키와 같은 키보드 명령을 사용하거나 요소를 마우스로 클릭하여 포커스를 얻을 수 있습니다.
포커스가있는 요소는 일반적으로 브라우저에서 어떤 방법으로 강조 표시됩니다 (예 : 요소를 둘러싸는 점선으로 표시). 포커스는 키보드 관련 이벤트를 가장 먼저받는 요소를 결정하는 데 사용됩니다.
숨겨진 요소에 포커스를 설정하려고하면 Internet Explorer에서 오류가 발생합니다. .focus()보이는 요소 에만 사용하도록주의하십시오 . 요소에 포커스를 설정하지 않고 요소의 포커스 이벤트 핸들러를 실행하려면 .triggerHandler( "focus" )대신에를 사용하십시오 .focus().
예를 들어 HTML을 생각해보십시오.
<form>
<input id="target" type="text" value="Field 1">
<input type="text" value="Field 2">
</form>
<div id="other">
Trigger the handler
</div>
이벤트 핸들러는 첫 번째 입력 필드에 바인딩 될 수 있습니다.
$( "#target" ).focus(function() {
alert( "Handler for .focus() called." );
});
이제 첫 번째 필드를 클릭하거나 다른 필드에서 탭으로 이동하면 경고가 표시됩니다.
.focus ()에 대한 핸들러가 호출되었습니다.
다른 요소를 클릭하면 이벤트가 트리거 될 수 있습니다.
$( "#other" ).click(function() {
$( "#target" ).focus();
});
이 코드가 실행 된 후 핸들러 트리거 메시지를 알려줍니다.
이 focus이벤트는 Internet Explorer에서 버블 링되지 않습니다. 따라서 이벤트 위임에 의존하는 스크립트는 focus여러 브라우저에서 일관되게 작동하지 않습니다. 버전 1.4.2로, 그러나, jQuery를 매핑하여이 문제를 해결 작동 focus받는 사람 focusin의 이벤트 위임 방법에서 이벤트 .live()와 .delegate().
추가 참고 사항 :
.focus()방법은 단지 약어 .on( "focus", handler )일 뿐이 므로 분리는 사용이 가능합니다 .off( "focus" ).
예 :
화재 초점입니다.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>focus demo</title>
<style>
span {
display: none;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p><input type="text"> <span>focus fire</span></p>
<p><input type="password"> <span>focus fire</span></p>
<script>
$( "input" ).focus(function() {
$( this ).next( "span" ).css( "display", "inline" ).fadeOut( 1000 );
});
</script>
</body>
</html>
0
댓글 0개