입력란에 입력 한 내용과 일치하는 제안이있는 드롭 다운 목록

Question

드롭 다운 목록, 입력란 및 버튼이 있습니다. 텍스트 상자에 단어를 입력하고 버튼을 클릭하면 드롭 다운 목록에서 텍스트 상자의 해당 단어에 따라 목록 항목을 선택해야합니다.

예를 들어

: 내가 입력하면 23 다음 드롭 다운이 항목이

Answer 1

@GG. jQuery를 UI를 사용하여 더 나은 옵션이 있지만, 여기 UI 매우 간단한 작업 모델 사용하지 않는 : http://jsfiddle.net/flackend/MA95K/2/

HTML :

<input type="text"> 
<input type="button" value="Button"> 
<select> 
    <option>20</option> 
    <option>21</option> 
    <option>22</option> 
    <option>23</option> 
</select>​ 

jQuery를 :

$('input[type="button"]').on('mousedown', function() { 

    var search_str = $('input[type="text"]').val() 

    $('option[selected="selected"]').removeAttr('selected'); 

    $('option').each(function() { 
     if($(this).text() == search_str) 
     { 
      $(this).attr('selected', 'selected'); 
      return false; 
     } 
    }); 
});​ 

---

편집

을

다음은 jQuery를 사용하는 새로운 jsfiddle입니다. UI의 자동 완성 : http://jsfiddle.net/flackend/rPGUy/1/

---

편집

$('option[selected="selected"]').removeAttr('selected');는 기본적으로 어떤이있는 경우는 값selected와 속성 selected있는 모든 옵션 태그를 발견하고 그 특성을 제거 ", 말하고있다. " 예를 들어

그래서이 :

<select> 
    <option>20</option> 
    <option selected="selected">21</option> 
    <option>22</option> 
    <option>23</option> 
</select> 

이 될 것이다 :

그래서 지금 우리가 jQuery를가 충돌하지 않습니다 새로운 옵션 태그를 선택할 때

<select> 
    <option>20</option> 
    <option>21</option> 
    <option>22</option> 
    <option>23</option> 
</select> 

.

Answer 2

jQuery UI Autocomplete (23)를 목록 시작해야 더 나은 당신이 필요로 정확히 할 것, 그리고.