2011-08-20 4 views
0

그래서 저는 jQuery 자동 완성을 통합 한 입력을 받았습니다. 나는 이것을 설명하는 방법을 모른다. 입력하면 내가 자동 완성 텍스트의 스타일을 변경하려고, 구글과 같은 그것의 자동 완성이 있습니다 자동 완성에, 'stackover'는 나머지보다 가벼운 것을jQuery Autocomplete : 필드의 텍스트를 기반으로 텍스트 스타일 변경

enter image description here

주 워드. .ui-menu .ui-menu-item a

사람이이 작업을 수행하는 방법을 알고 있나요 :

텍스트에 대한 CSS를 사용하는?

$('#q').autocomplete({ 
    source: ['stackoverflow', 'stackoverflow careers', 'stackoverflowerror', 'stackoverflow api', 'stackoverflow podcast'], 
    open: function(e, ui) { 
     var data = $(this).data('autocomplete');    
     data.menu.element.find('li').each(function() { 
      var $this = $(this); 
      var matched = data.term; 
      var rest = $this.text().replace(matched, ''); 
      var template = $('<span/>', { 
       'class': 'ui-found', 
       'text': matched 
      }).after($('<span/>', { 
       'text': rest  
      })); 
      $this.html(template); 
     }); 
    } 
}); 

가 여기에 live demo입니다 :

덕분에 당신이 적절하게 스타일을 할 수 있도록 당신이 일치하는 용어 주위에 범위를 open 이벤트를 구독하고 추가 할 수

답변

1

을 많이.

+0

클래스를 바꾸는 대신 추가 할 수 있습니까? 왜냐하면 모든 호버 (hover) 효과, keydown 효과 등을 놓치기 때문입니다. 감사 – jQuerybeast