Question

如何允许用户在预先输入文本框中输入多个值，例如，他输入ph并且提示弹出php并选择它，然后他输入da并弹出建议数据库，他也选择了。所以最后我输入框中的文字看起来像

php，数据库

我应该如何实现这种效果？

我尝试了以下代码：

$(document).ready(function () {

    var getTags = new Bloodhound({
        datumTokenizer: function(d){ return Bloodhound.tokenizers.whitespace(d.result)},
        queryTokenizer: function(d){ return Bloodhound.tokenizers.whitespace(d)},
        remote: {
            url: 'query=plughere',
            wildcard: 'plughere'
        }
    });
    getTags.initialize();
    $('.typeahead').typeahead({
        hint: true,
        highlight: true,
        minLength: 1
    }, {
        name: 'states',
        displayKey: 'name',
        source: getTags.ttAdapter(),        
    });

    $('.typeahead').bind('typeahead:selected typeahead:autocomplete', function(evt, item) {
        f = $('#hemo').val();
        $('#hemo').val(f + ", ");
    });

});

我将服务器编程为仅考虑逗号后的最后一个单词。

这里的hemo是我文本框的id。一旦我选择数据库，它就会删除之前输入的单词。因此，如果我先选择php，那么我选择数据库，它会从文本框中删除php，并为其添加数据库。

Jsfiddle

Answer 1

如果我是正确的那个关于该绑定事件的第二个参数输出基于此link的值，那么你应该像这样使用它。

 $('.typeahead').bind('typeahead:selected typeahead:autocomplete', function(evt, item) {
    f = $('#hemo').val();
    $('#hemo').val(f + item.value + ", ");
 });

更新

在看完你的小提琴之后，我以为你会有另一个文本框，你选择的值放在那里。

我不确定这是否可能是您想要的，但作为一种解决方法，您可以将所有选定的值放在不同的文本框中。

示例：Fiddle

如何在Typeahead中获取多个输入？

1 个答案: