0

正如我在主题中提到的，服务器加载大约需要 200-1000 毫秒（来自调试日志），但我必须再按一个键才能显示结果。即使我使自动完成延迟更长，它仍然无法显示结果，我仍然必须按一个键。

var timer;
//to wait for x ms until some chars typed
$("#keyword").bind("keyup", function(e) {
    if ($(this).val().length > 2)
    {
        window.clearTimeout(timer);
        timer = window.setTimeout(function(){               
            var datax = "";
            $(function () {
                $.getJSON("URI", ({"search":$("#keyword").val()}),function(datax){  
                    $("#keyword").autocomplete({
                        minLength: 3,
                        delay: 2000,
                        source: datax,
                        focus: function(event,ui){
                            $("#keyword").val( ui.item.nama);
                            return false;
                        },
                        select: function(event,ui){
                            $("#keyword").val( ui.item.nama);
                            $("#btnCariMainHeader").click();
                            return false;
                        }
                    })
                    .data("autocomplete")._renderItem = function(ul,item){
                            return $("<li>")
                            .data( "item.autocomplete",item)
                            .append("<a><table width='100%'><tr><td width='60px'>"+"<img height='60px' src='/thumb/" + item.value + ".jpg'/>"+"</td><td><b>"+item.nama+"</b><br><span class='suffix'>"+item.value+" "+item.bu+"</span><br><span class='suffix'>"+item.pos+"</span></td></tr></table></a>")
                            .appendTo(ul);
                    };
                });
            });
         },2000); 
    }
});
4

1 回答 1

2

在您的代码中，您将在获得 JSON 结果后创建一个 jQuery 自动完成功能。

但请注意，jQuery 自动完成不需要编写所有这些复杂的代码。您可以直接使用远程数据源（JSON 格式）作为自动完成的输入。也不需要绑定 keyup 事件来显示建议，这将由插件自动完成。

$("#birds").autocomplete({
    source: "search.php", // This is the url that returns the JSON list
    minLength: 2,
    select: function(event, ui) {
        log(ui.item ? "Selected: " + ui.item.value + " aka " + ui.item.id : "Nothing selected, input was " + this.value);
    } });

您可以在此处找到完整的文档和示例。

于 2013-01-02T18:47:03.300 回答