машинописный не работает на всех

Question

Использование щебет машинописный: https://twitter.github.io/typeahead.js

Я пытаюсь инициализировать несколько typeaheads с помощью атрибута data-typeahead, который представляет часть URL я хочу использовать в качестве источника.

Мне нужно, чтобы это можно было назвать после добавления динамических новых элементов [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

Чтобы создать новую функцию, содержащую каждый цикл, и вызвать ее при загрузке страницы, а также в любой момент, когда в 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 
     }); 
    }); 
}