jquery focus 예제

jQuery focus() 메서드는 html 요소에 이벤트 처리기 함수를 연결합니다. 이 이벤트 처리기 함수는 양식 필드에 포커스가 있을 때 실행됩니다. 다음 예제에서는 두 개의 입력 양식 필드가 있는데 필드가 포커스가 될 때 양식 필드의 배경 색을 변경하고 싶습니다(상자 내부를 클릭할 때) 이렇게 하려면 배경 색을 변경하는 이벤트 처리기 함수를 첨부했습니다. html 요소, 입력 HTML 요소에. 이렇게 하면 양식 필드에 포커스가 있으면 배경색이 #444 색상 값으로 변경됩니다. 출력: 양식 필드가 포커스가 되기 전에: HTML 페이지가 처음 로드되고 양식 필드를 클릭하지 않았을 때 이 스크린샷이 촬영됩니다: 첫 번째 양식 필드가 포커스를 얻은 후: 첫 번째 양식 필드가 포커스를 얻은 후 이 스크린샷은 첫 번째 양식 필드 내부를 클릭한 후 촬영됩니다. 양식 필드에 포커스가 설정되어 배경색이 이벤트 처리기 함수에 설정된 대로 #444 변경됩니다. 이전: 포커스 이벤트에 함수를 연결합니다. 포커스 이벤트가 발생합니다(텍스트 필드에 대한 메시지 표시) 필드에 포커스가 생기면 됩니다. 다음: 요소(또는 요소 내부의 요소)가 포커스를 얻거나 포커스를 잃을 때 요소의 배경색을 설정합니다. 포커스 이벤트는 인터넷 익스플로러에서 거품이 되지 않습니다. 따라서 포커스 이벤트가 있는 이벤트 위임에 의존하는 스크립트는 브라우저 전체에서 일관되게 작동하지 않습니다.

그러나 버전 1.4.2에서 jQuery는 이벤트 위임 메서드인 .live() 및 .delegate()의 focusin 이벤트에 포커스를 매핑하여 이러한 제한 사항을 해결합니다. 참고: 수신기를 선택한 요소 내의 모든 요소에 적용해야 하는 경우 focusin() 함수가 focus()를 선호합니다. 숨겨진 요소에 포커스를 설정하려고 하면 Internet Explorer에 오류가 발생합니다. 표시되는 요소에만 .focus()를 사용하도록 주의하십시오. 요소에 포커스를 설정하지 않고 요소의 포커스 이벤트 처리기를 실행하려면 .focus() 대신 .triggerHandler(“포커스”) 를 사용합니다. 포커스 이벤트는 마우스를 클릭하거나 탭하여 선택한 후 포커스를 받는 요소를 말합니다. 이제 jQuery 포커스 메서드는 상기 이벤트를 트리거하거나 트리거될 때 실행되도록 함수를 연결할 수 있습니다. 참고: jQuery 집합 포커스는 표시되는 요소에만 적용됩니다. 숨겨진 항목이 jQuery에서 포커스를 사용하는 경우 Internet Explorer는 오류를 보고합니다.