как отключить typeahead:active при фокусировании заполненного текстового поля в удаленном typeahead.js

Я использую typeahead.js, и это здорово, но вот мой вариант использования: у меня есть текстовое поле, которое уже заполнено строкой на стороне сервера при загрузке страницы, поэтому я не хочу, чтобы меню предложений было отображается, когда пользователь фокусирует текстовое поле.

typeahead.js, кажется, всегда показывает меню при фокусировке на текстовом поле. Это имеет смысл, поскольку minLength равно 2, а значение текстового поля похоже на «Тони» (или что-то еще). Но я пробовал использовать hint: false и вызывать $('.typeahead').typeahead('close') внутри обратного вызова для события typeahead:active, и ни один из них, похоже, не останавливает отображение меню.

Вот код инициализации, который я использую:

$('#locationInput').typeahead({
    hint: false,
    highlight: false,
    minLength: 2
},
{
    name: 'locations',
    display: 'name',
    source: typeaheadLocations, // a simple Bloodhound instance
    templates: {
        suggestion: function(locationObj) {
            return $('<div>' + locationObj.name + '</div>');
        }
    }
});

Существует есть небольшая задержка между тем, когда я фокусирую текстовое поле, и фактическим отображением меню, потому что нужно запустить удаленный GET. Поэтому я предполагаю, что мне нужно будет как-то предотвратить это после того, как он будет сфокусирован.


javascript typeahead.js twitter-typeahead
person taber    schedule 08.04.2016    source источник

Ответы (1)


arrow_upward
5
arrow_downward

Похоже, закрытие меню в событии typeahead:open помогает, но мне это кажется довольно хакерским. :(

$('#locationInput').typeahead({
    hint: true,
    highlight: true,
    minLength: 2
},
{
    name: 'locations',
    display: 'name',
    source: typeaheadLocations,
    templates: {
        suggestion: function suggestion(locationObj) {
            return $('<div>' + locationObj.name + '</div>');
        }
    }

}).on('typeahead:open', function(e) {
    var $input = $(e.currentTarget);

    if (!$input.data('wasFocusedOnce')) {
        $input.data('wasFocusedOnce', true);
        $input.typeahead('close');
    }

}).on('typeahead:close', function(e) {
    $(e.currentTarget).removeData('wasFocusedOnce');
}).on('keydown', function(e) {
    $(e.currentTarget).data('wasFocusedOnce', true);
});

Если кто-нибудь знает лучший способ сделать это, я весь внимание!

person taber    schedule 08.04.2016
comment
На дворе 2018 год, и это до сих пор единственный работающий способ. - person Tim Scarborough; 16.01.2019
comment
@TimScarborough На самом деле 2019 год :D - person taber; 18.01.2019
comment
ребята! Вы не представляете, как я счастлив видеть это в 2020 году!!!! - person The_Butcher; 22.09.2020