다양한 브라우저에서 입력 요소에 안정적으로 초점을 설정하는 방법은 무엇입니까?

IE 및 Focus 이벤트 문제

focus() 이벤트는 Internet Explorer에서 불안정할 수 있습니다. 다음 함수를 사용하여 입력 요소에 커서 포커스를 설정하려고 하면:

function change() {
  var input = document.getElementById('pas');
  var input2 = input.cloneNode(false);
  input2.type = 'password';
  input.parentNode.replaceChild(input2, input);
  input2.focus();
}

IE7은 focus() 호출에 응답하지 않고 커서를 입력 요소 외부에 둡니다. IE에서 이 문제를 해결하려면 setTimeout 함수를 사용하십시오.

setTimeout(function() { document.getElementById('myInput').focus(); }, 10);

Opera Woes

그러나 이 솔루션을 사용하면 Opera에 새로운 문제가 발생합니다. 이 문제를 해결하려면 "Opera용 텍스트 상자의 필수 인덱스에 포커스를 설정하는 방법"과 같은 리소스를 참조하세요.

범용 솔루션

모든 브라우저에서 호환성을 보장하려면 입력 요소를 즉시 사용할 수 없는 시나리오를 처리하는 코드 조각:

setTimeout(

  function( ) {

    var el = document.getElementById( "myInput" ) ;
    ( el != null ) ? el.focus( ) : setTimeout( arguments.callee , 10 ) ;

  }

, 10 ) ;

이 조각은 다시 시도합니다. 요소를 사용할 수 있을 때까지 10밀리초마다 집중하여 페이지 로딩 속도가 느리고 요소 가용성이 지연되는 문제를 해결합니다.

위 내용은 다양한 브라우저에서 입력 요소에 안정적으로 초점을 설정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!