jquery 自动完成无法正确加载结果,除非我按下按键,否则菜单不会显示

jquery Autocomplete is not loading the results correctly and menu doesn't show unless I press down key

这是我的:

    searchTimeoutID;
    InitQuickSearch = function() {
        $( 'input#quick-search' ).autocomplete({
            source: []
        });

        $('input#quick-search', document).on('keyup', function(e) {
            switch(e.which) {
                default: // live search
                    window.clearTimeout(searchTimeoutID); // remove timer
                    var str = $(this).val(); // search string
                    if (str !== '') { // do the search
                        searchTimeoutID = window.setTimeout(LiveSearch, 100);
                    }
                break;
            }
        });
    };

    LiveSearch = function() {
        var str = $('input#quick-search').val();
        if(str !== '') {
            $.ajax({
                type: 'POST',
                url: '/livesearch',
                data: { query: str },
                cache: false,
                success: function(data){
                    var results = data.split(',');
                    alert(results); // displays correct results here

                    $( 'input#quick-search' ).autocomplete( 'option', { source: results });
                },
                error: function(response) {
                    printError(response);
                }
            });
        }
        return false;
    };

当我使用 alert(results) 输出结果变量时,值看起来是正确的。

但是,当我尝试更新自动完成中的值时,它没有显示正确的值。另外,我必须按向下键才能显示菜单。

$( 'input#quick-search' ).autocomplete( 'option', { source: results });

我做错了什么?

我只需要更改:

searchTimeoutID = window.setTimeout(LiveSearch, 100);

至:

LiveSearch();