将jQuery动态搜索下拉列表与多项选择功能集成在一起的麻烦

Question

我正在集成一个搜索功能，该功能将使用数据库中的内容动态填充下拉菜单。然而，有了这样说，当点击下拉中的一个选项时，我希望搜索功能“重置”自身，以便可以选择另一个选项，从而在输入框中具有两个或更多个可能的选择。例如，这是所需的输出：

目前，下面的代码只允许生成一次动态下拉列表：

jQuery(".search").keyup(function() {
        var searchbox = jQuery(this).val();
        var dataString = 'searchword='+ searchbox;

        if(searchbox==''){
            jQuery("#display").hide();
        } else {

            jQuery.ajax({
                type: "POST",
                url: "/inbox/user-search/",
                data: dataString,
                cache: false,
                success: function(html)
                {   jQuery("#display").html(html).show();

                    jQuery("li").click(function(){ 

                        jQuery("#send-message-to-user").val(jQuery.trim(jQuery(this).text())+"; ");

                        jQuery("#display").hide();
                    })

                }
            });
        } return false;    

    });

我显然有一些东西显而易见......任何帮助都会非常感激...欢呼

Answer 1

当HTML不在这里时有点困难。这会让你顺路吗？：

function getTextBehindLastSemicolon(string) {
    if (string.match(/\;\ (.*)$/)[0]){
        return string.match(/\;\ (.*)$/)[0];
    }
    else{
        // If no semicolons
        return string;
    }

}

var isLoading=false;
function autocomplete(searchWord) {
    if (isLoading){
        return;
    }
    isLoading=true;

    var dataString = 'searchword=' + searchWord;

    if (searchWord == '') {
        jQuery("#display").hide();
    } else {
        jQuery.ajax({
            type: "POST",
            url: "/inbox/user-search/",
            data: dataString,
            cache: false,
            success: function(html) {
                jQuery("#display").html(html).show();

                jQuery("li").click(function() {
                    jQuery("#send-message-to-user").val(jQuery.trim(jQuery(this).text()) + "; ");
                    jQuery("#display").hide();
                });
                isLoading=false;

            }
        });
    }
    return false;
}

jQuery(".search").keyup(function() {
    autocomplete(getTextBehindLastSemicolon(jQuery(this).val()));
    return false;
});