는 방법을 키보드로 또는 사이에서 드롭다운"옵션"?

Question

나는 사용자 정의 ajax[div]기반으로 역동적 드롭다운입니다.

나는[input]상자; onkeyup, 실행 Ajax 검색하는 결과를 반환에 divs 고 다시 그에 사용하는 innerHTML.이 div모두가 하이라이트 onmouseover 그래서,전형적인 성공을 검색율은 다음과 같은 구조(용서 반드):

[input]
 [div id=results] //this gets overwritten contantly by my AJAX function
  [div id=result1 onmouseover=highlight onclick=input.value=result1]
  [div id=result2 onmouseover=highlight onclick=input.value=result2]
  [div id=result2 onmouseover=highlight onclick=input.value=result2]
 [/div]

그것은 작동합니다.

그러나 나는 누락에 중요한 기능에서도 정규 HTML 요소입니다.수 키보 또는 사이에"options".

알 javascript 키보드 이벤트를 처리하지만;가 좋은를 찾을 안내합니다.(물론,후속 질문이 끝:사용할 수 있습니까 <ENTER> 를 트리거 onclick 이벤트?)

Answer 1

당신이해야 할 일은 붙이고 이벤트 리스너의 div 가 id="results".여 이렇게 할 수 있습니다 추가 onkeyup, onkeydown, 니다,등등.특성 div 을 만들 때 또는 그에 첨부할 수 있을 사용하여 이러한 자바 스크립트.

내 추천 것을 사용하는 것 같은 AJAX 라이브러리 YUI, jQuery, Prototype, 니다,등등.두 가지 이유:

1. 같은 소리를 만들려고 하는 자동 완성 제어 있는 대부분의 AJAX libaries 제공해야합니다.는 경우 사용할 수 있는 기존 구성 요소에 당신 자신을 저장 시간을 많이 있습니다.
2. 하지 않는 경우에도 사용하고 싶 제어에 의해 제공되는 라이브러리,모든 라이브러리를 제공 이벤트 라이브러리는 데 도움을 숨기기 사이의 차이는 이벤트는 Api 를 제공해 다른 브라우저입니다.

잊 addEvent,사용 Yahoo!'s 유틸리티 이벤트 제공하는 좋은 요약의 이벤트 라이브러리를 제공해야 합니다.나는 확인 이벤트 라이브러리에 의해 제공됩 jQuery,시제품,등등.al.유사한 기능을 제공합.

는 경우에는 제가 당신의 머리 위에 보 이 문서 첫째로 다시 원래의 문서를 참조하십시오(내가 찾는 문서를 만들어 훨씬 더 감각한 후에 나가 사용되는 이벤트 라이브러리).

의 몇 가지 다른 것들:

• JavaScript 를 사용하여 제어할 것보다 쓰기 onkeyup etc.특성으로 귀하의 HTML.지 않으면 뭔가를 원 정말 단순 나 자바스크립트를 사용한다.
• 당신이 쓰는 경우에 당신의 자신의 코드를 처리할 키보드 이벤트 좋은 키 코드를 참조 이 정말 편리합니다.

Answer 2

떨어져 내 머리 위로,나는 생각하는 당신을 유지할 필요가 일부 형태의 데이터 구조에서 JavaScript 를 반영하는 항목에서는 현재의 드롭 다운 목록입니다.당신은 또한에 대한 참조가 있어야 합니다 현재 활성/선택 항목입니다.

각 시간 keyup 나 keydown 가 발생하고,업데이트 기준을 활성/선택 항목에서 데이터 구조입니다.제공하는 정보를 강조하기에 UI,추가 또는 제거래 이름은 스타일을 통해 CSS 에 따라 해당 항목이 활성/선택하거나지 않습니다.

또한,이 빅하지만, innerHTML 정말 기준(으로 보고 createTextNode(), createElement(), 고 appendChild() 에 대한 표준을 만드는 방법입니다.)수도 있습니다 보고 싶어에 대한 연결 이벤트 처리기에 자바스크립트 보다는 오히려 이렇게 HTML 특성이 있습니다.