使用 getJSON 获取数据时遇到 Javascript 自动完成库问题

Question

我遇到了以下代码的问题：

var setupSearch = {

searchSuggest: function(field) {
    $.getJSON('/get-all-journals', {'url':'on'}, function(data) {

        var SHCount = Number($.cookie('SHCount'));
        var SHArray = new Array();
        for (i=1; i <= SHCount; i++) {
            SHArray.push($.cookie('SH'+i));
        }
        $(field).ddautocomplete(removeDuplicate(SHArray), data.response.docs, {
            matchContains: true,
            max: 5,
            cacheLength: 5000,
            selectFirst: false,
            scroll: false,
            formatResult: function(str) { return str; },
            formatItem2: function(item) {
                return item.journal_display_name;
            },  
            formatMatch2: function(item) {
                return item.journal_display_name;
            },  
            formatResult2: function(item) {
                return item.journal_display_name;
            }   
        }); 
    }); 
},  
                
                        
searchForm: function(form) {

    var field = form.find('textarea');
    // Setup query field for default text behavior
    // setupField(field);

    setupSearch.searchSuggest(field);
    field.autogrow();
        
    field.keydown(function(e) {
        if (e.keyCode == 13) {
            form.submit();
            return false;
        }   
    }); 

    // Make all forms submitting through Advanced Search Form
    form.submit(function(e) {
        e.preventDefault();
        setupSearch.submitSearch(form, field);
    });
}, 


 submitSearch: function(form, field) {
    if (advancedSearch.checkMinFields() || (!field.hasClass('defaultText') && field.val() != '')) {
        // Sync the refine lists
        // syncCheckboxLists($('#refineList input'), $('#advancedRefineList input'));
        form.find('button').addClass('active');
        $('#advancedSearchForm').submit();
    } else {
        $('#queryField').focus();
    }
},

当我尝试通过按 Enter 使用自动完成下拉菜单时，它似乎遇到了“竞争条件”，表单将提交我输入的内容，而不是自动完成在文本字段中放置的内容。有什么方法可以控制事件的顺序，以便form.submit() 将使用自动完成填充到文本字段中的内容？

Answer 1

实际的自动完成下拉菜单很可能表示为一个样式列表（或其他一些元素），该列表浮动以定位在文本框下方。提交时，让您的函数等待（最多一两秒）自动完成菜单被销毁或隐藏。这将确保插件在提交数据之前有时间填写文本框。

编辑

试试这样的：

$("#myDropdown").bind("autocompleteclose", function(){
    // Continue with submitting your form
});

在提交表单的地方使用它，并将提交代码放在回调中。这样，它会在提交表单之前等待自动完成关闭。您需要为此添加某种超时，以防止它在长时间延迟后提交（但不确定何时会发生这种情况）。