텍스트 상자 그룹에 대한 자동 완성 목록

내 특정 질문에서 자동 완성 목록을 구현하는 데 대한 답변을 얻었습니다. 그러나 제안 된 항목을 클릭하면 입력 상자가 비어 있습니다. 클래스 track의 입력 상자가 있습니다. 내가 흐림 이벤트 인에 사용되는 내 기능은 ..텍스트 상자 그룹에 대한 자동 완성 목록

<input name="track[]" type="text" class="track" maxlength="150"/> 
<div class="suggestionsBox" id="suggestions" style="display: none;"> 
    <img src="images/upArrow.png" style="position: relative; top: -12px; left: 50px;" alt="upArrow" /> 
    <div class="suggestionList" id="autoSuggestionsList">&nbsp;</div> 
</div> 

<script> 
$('input.track').keyup(function() { 
var poetname = $(this).val(); 
if(poetname.length == 0) { 
    // Hide the suggestion box. 
    $(this).parent().find('#suggestions').hide(); 
} 
else { 
    $.ajax({ 
     url: "rpc.php", 
     type: "post", 
     data: {queryString: poetname}, 
     context: this, // i.e. the text box 
     success: function(data) { 
      if(data.length >0) { 
       $(this).parent().find('#suggestions').show(); 
       $(this).parent().find('#autoSuggestionsList').html(data); 
      } 
     } 
    }); 
} 
}); 

$('input.track').blur(function() { 
    $(this).val(); 
    $(this).parent().find('.suggestionsBox').hide(); 
}); 
</script>

출처

2011-12-12 Rahul Singh

코드는 당신이 무엇을 설명하지 (그리고하지 않습니다) 할 수 있습니다. 입력 상자를 실제로 업데이트하는 부분을 포함하여보다 완벽한 코드 예제를 제공하십시오. FWIW,'$ (this) .val();'은 현재 아무 것도하지 않습니다. –

자동 검색 목록에 대한 주요 이벤트를 편집했습니다. 희망이 도움이 될 것입니다. –

두 가지 here--

난 당신이 캡처 할 이벤트를 캡처하고 있는지 모르겠어요 진행. 유스 케이스가 무엇인지 말할 수는 없지만 제안을 클릭하는 것을 듣고 있다고 말하는 것 같습니다. 그러나 제안 상자의 아무 곳에서나 클릭을 캡처하지는 않습니다.
흐림 이벤트는 .suggestionsBox을 숨기고있는 것이고 그게 무슨 뜻일까요? $(this).val(); 라인은 유용하지 않습니다. 자바 스크립트는 실제로 그 값을 찾고 있지만, 아무 것도하지 않습니다.

아무리 입력 상자가 공백으로 표시되지 않습니다.

다음은 아약스에 대한 테스트 에코를 사용하는 바이올린의 : http://jsfiddle.net/xXF9v/

출처

2011-12-12 18:21:36

텍스트 상자 그룹에 대한 자동 완성 목록

답변

관련 문제