Question

我设法让jQuery UI自动完成工作。但是，由于我在许多输入字段中使用它，我想让它更通用，所以我不必复制它。因此，而不是以下代码：

$(function() {
    var cache = {};
    $("#searchGuyInput").autocomplete({
        minLength: 2,
        source: function(request, response) {
            // Getting a JSON array to populate the list
            var term = request.term;
            if (term in cache) {
                response(cache[ term ]);
                return;
            }

            $.getJSON("c_select_guy.php", {request: term}, function(data, status, xhr) {
                cache[ term ] = data;
                response(data);
            });
        },
        select: function(event, ui) {
            // What happens once I have selected a name from the list
            if (ui.item){
                createInputField(ui.item.Name + " " + ui.item.Surname,ui.item.guyID);
            }
        }
    })
    .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
        // Here I can format the JSON array to display the rows in the list
        return formatted;
    };

    function createInputField(message, guyID) {
        // creates a new div for the selected element
    };    
});

我试图使用：

function autocomp(inputID) {  //CHANGED
    var cache = {};
    $(inputID).autocomplete({ //CHANGED
        minLength: 2,
        source: function(request, response) {
            // Getting a JSON array to populate the list
            var term = request.term;
            if (term in cache) {
                response(cache[ term ]);
                return;
            }

            $.getJSON("c_select_guy.php", {request: term}, function(data, status, xhr) {
                cache[ term ] = data;
                response(data);
            });
        },
        select: function(event, ui) {
            // What happens once I have selected a name from the list
            if (ui.item){
                createInputField(ui.item.Name + " " + ui.item.Surname,ui.item.guyID);
            }
        }
    })
    .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
        // Here I can format the JSON array to display the rows in the list
        return formatted;
    };

    function createInputField(message, guyID) {
        // creates a new div for the selected element
    };    
}

autocomp("#searchGuyInput"); //CHANGED

我用// CHANGED评论突出显示了3个更改。

但是现在即使autocomplete返回了一个很好的填充元素列表，当我从自动完成中的元素中选择时，ui.item函数中的select变量是未定义的，它不起作用了！

我理解错误是什么？

我认为$(function());只是在javascript中定义匿名函数的一种方式，因此如果我将其命名为，我可以多次为不同的输入字段调用它。

Answer 1

在这个帖子中找到了解决方案： How to create generic (reusable) JavaScript autocomplete function

显然将其称为

autocomp("#searchGuyInput");

不起作用，您需要将其称为：

$(function() {
        autocomp("#searchGuyInput");
});

我仍然没有得到这些$(function()来电，如果有人想澄清它我会很高兴。

没有匿名函数的jQuery UI输入自动完成

1 个答案: