jQuery - UI 自动完成问题答案

【问题标题】：jQuery - UI autocomplete issuejQuery - UI 自动完成问题
【发布时间】：2012-05-22 07:26:23
【问题描述】：

使用jQ UI Autocomplete with multiple values

我的函数是这样的

mailto_input.bind( "keydown", function( event ) {
    if ( event.keyCode === $.ui.keyCode.TAB && $( this ).data( "autocomplete" ).menu.active ) {
        event.preventDefault();
    }
}).autocomplete({
    source: function( request, response ) {
        $.getJSON( "core/search.php", {
            term: extractLast( request.term )
        }, response );
    },
    search: function(){
        // custom minLength
        var term = extractLast( this.value );
        if ( term.length < 2 ) {
            return false;
        }
    },
    focus: function() {
        // prevent value inserted on focus
        return false;
    },
    select: function( event, ui ) {
        var terms = split( this.value );
        // remove the current input
        terms.pop();
        // add the selected item
        terms.push( ui.item.value );
        // add placeholder to get the comma-and-space at the end
        terms.push( "" );
        this.value = terms.join( "; " );
        return false;
    }
});

我想要实现的是，限制用户只选择服务器端数据。我的意思是，只有在 PHP 端有任何结果时，我才想将术语添加到输入框中。否则，通知用户，服务器中没有该术语的数据

例如

我想防止添加像 sdsf 这样的词（在这种情况下，服务器会像 [] 一样响应）。换句话说，仅当服务器端至少有 1 条建议时才添加。否则保持原样并通知用户有关问题。

这可能吗？我怎样才能达到这个结果？

【问题讨论】：

你的意思是像stackoverflow做标签的方式？
尝试查看stackoverflow api

标签： javascript jquery jquery-ui autocomplete getjson

【解决方案1】：

试试Tokeninput。它完全符合您的要求。

另外，这里是demo，只是为了确保它是你想要的......

【讨论】：

找不到我需要的东西。当您键入“gsfs”之类的内容时，它不会阻止
虽然用户可以输入“gsfs”，但实际上不能将其作为标签输入。只有 PHP 返回的结果被转换为标签。当用户提交表单时，您可以轻松过滤掉非标记条目。

【解决方案2】：

好吧，他们这样做的方式是将标签交换为跨度。

<div id="taginput">
    <span id="tags">
    <span>tagname</span>
    </span>
    <input type="text" id="tagtext"/>
</div>

您必须这样做，以便在之前添加建议作为跨度：

$('.suggestion_element_class').click(function() {
    textof = this.text();
    $('#tags').append('<span>' + textof + '</span>');
    $('#tagtext').val('');
});

当然，你必须先得到建议和一切。

【讨论】：