HTML 선택 태그 자동 완성

내가 어떤 선택 태그를 가지고 :HTML 선택 태그 자동 완성

<select id="fruits"> 
    <option value="1">Apple</option> 
    <option value="2">Banana</option> 
    <option value="3">Orange</option> 
    <option value="4">Grapes</option> 
    <option value="5">Ginger</option> 
</select>

내가하고 싶은 것은, 때마다 select의 사용자 초점, 그는 그의 키보드의 키 "G"을 클릭 것, 옵션 "Grapes"이 자동으로 선택되고 "G"을 다시 누르면 "Ginger"이 선택되는 식으로 계속됩니다.

실마리가 없습니다.

출처

2013-08-18 kfirba

을 Selectize하는

. –

이것이 드롭 다운 (선택 컨트롤)의 기본 동작이라고 생각합니다. 그것을 성취하기 위해 제로 노력을해야합니다.

이 JSbin이 .. 거기에 선택 상자 때 사용자가 처음 키보드 grapes is selected에 g을 누르면입니다

ginger is selected초 http://jsbin.com/UYeZaPA/1/edit

출처

2013-08-18 17:56:55 Amith

콤보 박스는 드롭 다운 메뉴 (HTML에서 선택하면 얻는 것)와 텍스트 입력 (텍스트 입력)의 조합 (따라서 이름) 인 UI 컨트롤입니다. HTML에는 콤보 상자로 표시되는 기본 컨트롤이 없습니다. – Quentin

하지만 때로는 작동하지 않습니다. 나는 10 번 이상 키를 누를 수 있고, 그 시작 문자로 인스턴스로 점프하지 않는다. – kfirba

@Quentin : 나를 고쳐 주신 고마운 친구. 내 대답을 업데이트했습니다 :) – Amith

이 필요 할 수없는 노력을하려고합니다. 모든 브라우저에서 직접 사용해보십시오. 브라우저는 기본적으로 당신을 위해 그것을 할. 크롬 또는 현재 브라우저에서 시도

예 : 페이스 북 페이지 가입 양식 :

해당 월 선택하고 J

먼저 두 번째 키를 누릅니다에 1월

표시됩니다 눌러 J의 경우 6 월 .. 등이 표시됩니다.

출처

2013-08-18 18:02:45 Rahul

DEMO

당신이 원하는 것은 드롭 다운 목록의 기본 기능입니다.

드롭 다운 목록을 검색하려면이 플러그인을 사용해보십시오.

jQuery Searchable DropDown Plugin Demo

DEMO - with your code

$('#fruits').searchable();

당신이 당신의 HTML을 선택 요소에 자동 완성 기능을 추가하려는 경우 당신은 또한, DEMO

출처

2013-08-19 02:01:45

[jQuery Searchable DropDown Plugin Demo] (http://effinroot.eiremedia.netdna-cdn.com/repo/plugins/forms-controls/searchabledropdown/)> *이 사이트는 ERR_NAME_NOT_RESOLVED'에 도달하지 못했습니다 * – Pang

음을 시도 할 수는 selectize.js 것보다 아무것도 더있다

당신이해야 할 일은 css와 js 파일을 p 또는 cdns를 사용할 수 있습니다. 내가 그것을 설치 해달라고로 이동 웹 사이트이 이미 IE와 크롬, 파이어 폭스에 대해 확실하지에서 선택 상자에 대한 발생 here

출처

2016-11-05 09:25:03

HTML 선택 태그 자동 완성

답변

관련 문제