Twitter的突出事先鍵入的內容

Question

我使用Twitter Typeahead（該v0.10.5 typeahead.bundle.jshere）和Handlebars v4.0.6。

除了突出顯示字樣的以外，所有內容都按預期工作（我可以搜索我的數據集和自動填充作品）。你可以看到這個應該出現的例子here。

我的代碼如下。

var books = new Bloodhound({ 
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('title'), 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    limit: 10, 
    prefetch: { 
     url: 'books.json', 
     ttl: 0, 
     filter: function(list) { 
      return $.map(list, function(book) { 
       return { 
        title: book.title, 
       }; 
      }); 
     } 
    } 
}); 

$('.demo .typeahead').typeahead({ 
    hint: false, 
    highlight: true, // <-- this doesn't work 
    minLength: 1 
}, { 
    name: 'books', 
    displayKey: 'title', 
    source: books.ttAdapter(), 
    engine: Handlebars, 
    templates: { 
     empty: ['<div class="empty-message">', 'no results found', '</div>'].join('\n'), 
     suggestion: Handlebars.compile('<p>{{{title}}}</p>') 
    }, 
}); 

我不認爲這是一個CSS問題，因爲我刪除了所有的CSS，仍然沒有突出顯示。

我已經試過typeahead（v0.11.1）的最新版本，但這沒有什麼區別。

任何幫助表示讚賞。

Answer 1

看來很多人都有問題沒有指定所需的參數minLength: x。

就你而言，你已經做到了。問題是，你需要添加以下的CSS

.tt-cursor { 
    color: #f1b218; 
}