자바 스크립트를 사용하여 데이터 제안을 표시하는 방법?

Question

새 <datalist>은 일반적으로 매우 유용하지만 제안 사항이 충분하지 않다고 생각합니다. 자바 스크립트를 사용하여 datalist 제안 표시를 트리거하는 방법이 있습니까?

예를 들어 <input type="number"> (jsFiddle)에 데이터리스트가 있습니다. 크롬에서

<label> 
    Enter a Fibonacci number: 
    <input type="number" list="fibonacci" min="0" id="myinput"> 
</label> 
<datalist id="fibonacci"> 
    <option value="0"> 
    <option value="1"> 
    <option value="2"> 
    <option value="3"> 
    <option value="5"> 
    <option value="8"> 
    <option value="13"> 
    <option value="21"> 
</datalist> 
<button type="button" id="show-suggestions">Show suggestions</button> 

<script> 
$('#show-suggestions').click(function() { 
    // .showSuggestions() does not exist. 
    // I'd like it to display the suggested values for the input field. 
    $('#myinput').showSuggestions(); 
}); 
</script> 

이 제안의 전체 목록이 입력이 비어있는 경우에만 표시됩니다 이미 포커스가, 사용자는 다음 입력을 클릭합니다. 아래쪽 화살표는 제안 사항을 표시하지 않으며 단순히 값을 감소시킵니다.

제안 사항을 더 잘 보이게하고 싶습니다. 예를 들어 제안 목록을 여는 데 필요한 버튼을 추가했습니다. onClick 처리기에 무엇을 넣을까요?

이 예에서는 Chrome, jQuery 및 숫자 입력을 사용했지만 모든 입력기와 독립적 인 일반 솔루션을 선호합니다.

Answer 1

type = "number"를 제거하면 기본 alt + downarrow 키보드 단축키를 사용하여 드롭 다운 목록을 가져올 수 있습니다.

그래도 작동하지 않는다면. 하이브리드 방식을 사용하는 것이 좋습니다. https://github.com/mmurph211/Autocomplete