jQuery AutoComplete，如何接受 Found &未找到的条款

Question

我引用了本教程中看到的 jQuery 自动完成插件代码： http://net. tutsplus.com/tutorials/javascript-ajax/how-to-use-the-jquery-ui-autocomplete-widget/

本教程的问题是它仅支持在服务器上找到的项目。我想做的是允许用户使用服务器上找到的项目（就像今天一样），但也允许用户输入新值而不破坏插件...示例，这样您就可以输入用户的电子邮件地址，按 Enter 键，然后继续使用该插件，也许然后在服务器上找到另一个项目并再次按回车键。

有想法吗？可能的？

Answer 1

您可以尝试将输入的内容附加到建议列表中。这样他们基本上可以使用“req.term”选择他们正在输入的内容。像这样：

//process response
$.each(data, function(i, val){                              
    suggestions.push(val.name);
});
//append what has been typed in so it's available for selection
suggestions.push(req.term);
//pass array to callback
add(suggestions);

然后，在 select: 函数中，您可以使用 ajax 调用将选择插入到数据库中（如果该选择尚不存在）。

//define select handler
select: function(e, ui) {

    //create formatted friend
    var friend = ui.item.value,
        span = $("<span>").text(friend),
        a = $("<a>").addClass("remove").attr({
            href: "javascript:",
            title: "Remove " + friend
        }).text("x").appendTo(span);

    //add friend to friend div
    span.insertBefore("#to");

    //insert selected email if doesn't already exists
},

这是一个按键示例，用于在输入时插入格式化的朋友：

$("#to").keypress(function(e){
    var code = (e.keyCode ? e.keyCode : e.which);
    if (code == 13) { //Enter keycode
        e.preventDefault();

        //create formatted friend
        var friend = $(this).val(),
            span = $("<span>").text(friend),
            a = $("<a>").addClass("remove").attr({
                href: "javascript:",
                title: "Remove " + friend
            }).text("x").appendTo(span);

        //add friend to friend div
        span.insertBefore("#to");

        $(this).autocomplete('close');
    }
});