IE에서 ajax 드롭 다운 요소의 포커스를 되 찾는 방법은 무엇입니까?

Question

일반적인 HTML 요소로 렌더링되는 드롭 다운 요소가 있습니다. 드롭 다운 요소는 모든 변경 사항에 대해 아약스를 사용하여 제출합니다. 문제는 페이지에 대해 특정 탭 순서를 구현해야한다는 것입니다. ajax 호출이 돌아 왔을 때 잃어버린 정보의 좌절을 막기 위해 Ajax 호출이 돌아올 때까지 사용자 상호 작용을 막는 화면 제거기를 추가했습니다. 또한 드롭 다운 값에 따라 다음 탭 순서 요소가 비활성화되는 경우도 있습니다.

이제 사용자가 필드를 떠날 때 '변경'이벤트가 발생하기 때문에 Firefox와 Chrome에서 모든 것이 올바르게 작동합니다. 탭을 누르면 화면 disabler가 팝업되고 잠시 기다리라는 메시지가 표시되고 아약스가 끝난 후에 javascript 핸들이 처리됩니다. 다음 요소의 탭 순서.

그러나 IE8/7은 자체 문제가 있습니다. IE에서 '변경'이벤트는 Firefox/Chrome에서 다르게 발사됩니다. 그것은 값의 모든 단일 변경에 해고됩니다. 따라서 화면 disabler가 사라지면 사용자가 UP 또는 DOWN 화살표 키를 사용하여 값을 변경했을 수 있으므로 드롭 다운 메뉴를 다시 위/아래로 이동할 수 있습니다. 메뉴를 다시 누릅니다.

Ajax 콜백이 돌아 왔을 때 Primefaces와 jQuery의 기능을 사용하여 특정 자바 스크립트를 실행 해 보았습니다. 그러나, 그것은 잘 작동하지 않았다. 때로는 드롭 다운이 집중되었지만 곧바로 포커스가 사라졌습니다. 그러나 자바 스크립트의 타임 아웃을 사용해 보았습니다. 그러나 드롭 다운 요소가 어떻게 든 '충분하지 않음'포커스를 얻었습니다. 'Tab'키를 누르면 페이지 상단으로 이동하고 드롭 다운 메뉴에서 점프하는 데 사용되는 UP 또는 DOWN 화살표 키를 누르십시오. 그 값을 변경하는 대신.

if (jQuery.browser.msie || jQuery.browser.opera) { 
    interval = setInterval(function(){ 
     if (document.activeElement.id != id) { 
      document.getElementById(id).focus(); 
     } else { 
      clearInterval(interval); 
    } 
    }, 500); 
} 

이는 '전체'초점과 TAB 및 UP을/가져옵니다 다음과 같이

내 최종 솔루션 (슬프게도, 여전히 허용되지 않음) (ID가 '선택'요소의 ID입니다)이었다 DOWN 화살표 키가 예상대로 작동합니다. 그러나 UP/DOWN 키를 사용하여 값 대기열을 너무 많이 변경하면 컴퓨터가 너무 느려지고 때때로 웹 사이트를 사용할 수 없게됩니다. 초점은 다시 드롭 다운으로 돌아가고 사용자는 간격을 지우려면 10 초 이상 기다려야합니다.

그래서이 문제에 대한 더 나은 해결책을 묻습니다.

Answer 1

onchange 대신 드롭 다운의 onblur 이벤트를 사용해야한다고 생각합니다. 올바르게 이해하면 올바른 해결책이 될 것입니다.