twitter Typeahead输入在选择时未定义

Question

我有一个预先工作正常，但当我选择一个条目时，输入填充“undefined”

知道为什么吗？是否有“选择”事件或某些东西，我可以使用当前选择的值填充输入？我没有在网上找到任何有关此行为的信息。 这是先行声明：

$('.receivers-input').typeahead({
        minLength: 0,
    }, {
        source: function (query, cb) {
            var Request = $.ajax({
                methode: "POST",
                url: "MessagingService.svc/UserAutocomplete",
                dataType: "json",
                contentType: "application/json; charsert=utf-8",
                data: JSON.stringify({ "inputString": query })
            }).done(function (Response) {
                if (!Response.UserAutocompleteResult.success) {
                    if (!Response.UserAutocompleteResult.message)
                        return;
                    ErmesManager.notify(Response.UserAutocompleteResult.message, null);
                    return;
                }
                cb(Response.UserAutocompleteResult.d);
            });
        },
        templates: {
            suggestion: function (suggestion) {
                return '<p>' + suggestion + '</p>';
            }
        }
    }).on('typeahead:selected', function (event, data) {
        $('.receivers-input').val('');
        ComputeToken(data, true);
    }).on('blur', function (event, data) {
        $('.receivers-input').val(data);
    });
}

Answer 1

添加on('typeahead:cursorchanged', function (event, data) {});可以解决问题。 因为我使用placeholder显示器有点乱。我通过在tt-hint类上添加visibility: hidden来清理它。

以下是完整修改：

CSS：

tt-hint{
    visibility: hidden;
}

Javascript：

...
}).on('typeahead:selected', function (event, data) {
        $('.receivers-input.tt-input').val('');
        ComputeToken(data, true);
    }).on('blur', function () {
        $('.receivers-input.tt-input').val('');
    }).on('typeahead:cursorchanged', function (event, data) {
        $('.receivers-input.tt-input').val(data);
    });

cursorchanged事件没有记录here，如果有人有其他文档来源我很乐意拥有它们。

我想补充一点，这个问题和答案都在旧的bootstrap版本上下文中。使用最新版本（目前）typeahead：select也可以完成这个技巧。