1

我如何允许用户在 typeahead 文本框中键入多个值，例如，他键入 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 并向其中添加数据库。

提琴手

4

1 回答 1

0

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

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

更新

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

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

示例：小提琴

于 2015-05-04T05:36:31.990 回答