先行入力された文字は、Twitterの先行入力を使用して、すべての

Question

では動作しません：https://twitter.github.io/typeahead.js

私はソースとして使用するURLの一部を表しdata-typeahead属性を介して複数のtypeaheadsを初期化しようとしています。

ダイナミックな新しい[data-typeahead]要素がページに追加された後、これを呼び出せるようにする必要があります。

私のコードはまったく機能しません。すでにページにある[data-typeahead]要素でも機能しません。

$('[data-typeahead]').typeahead({ 
    source: function (query, process) { 
     $.get(this.$element.data('typeahead')+'/'+query, function (data) { 
      alert(data); 
      process(data); 
     }); 
    }, 
    items: 10 
}); 

ご協力いただければ幸いです。

Answer 1

各ループを含む新しい関数を作成し、ページが読み込まれたときに呼び出す必要がありました。また、新しいtypeahead要素がDOMに追加されたときに呼び出す必要がありました。

各ループは、既存のすべての先読みを破棄し、それらを再初期化します。

これは数時間を費やしていましたが、これがうまくいった唯一の解決策です。

function initialize_typeaheads() { 
    $('[data-typeahead]').each(function() { 
     var element = $(this); 

     element.typeahead('destroy'); 

     var results = new Bloodhound({ 
      datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'), 
      queryTokenizer: Bloodhound.tokenizers.whitespace, 
      remote: { 
       url: element.data('typeahead')+'/'+'%QUERY', 
       wildcard: '%QUERY' 
      } 
     }); 

     element.typeahead(null, { 
      source: results, 
      limit: 10 
     }); 
    }); 
}