Question

当输入失去焦点时，是否无法取消jQuery自动完成ajax调用？我得出结论，我需要A）在模糊时销毁自动完成（并删除'ui-autocomplete-loading'类）和B）在焦点上创建自动完成。我的代码，可以正常工作：

            $('#myinput').focus(function(){
                $('#myinput').autocomplete({
                    delay: 250,
                    source: function(request, response) {
                        $.ajax({
                            url: "cfc/myfunctions.cfc?method=lookup&returnformat=json",
                            dataType: "json",
                            data: {
                              search: request.term,
                              maxRows: 20
                            },
                            success: function(data) {
                              response(data);
                            }                   
                        })
                    },
                    change: function(event, ui) {     
                        if (!ui.item) {
                            $(this).val('');
                        }
                    }
                });
            });

            // necessary to cancel autocompletes if the user leaves the input or closes the filter
            $('#myinput').blur(function(){
                $(this).removeClass('ui-autocomplete-loading').autocomplete('destroy');
            });

这具有取消模糊时自动完成（并删除loading.gif图标）的预期行为，并在输入获得焦点时启用自动完成功能。

当用户执行此操作而自动完成需要很长时间才能响应时，会发生什么变得奇怪。在这种情况下，我有一个自动完成，有时需要20秒才能响应（是的，我知道，这是另一个问题）。如果用户键入一个值，则单击其他位置，然后返回另一个自动完成程序，进行新调用，显示新的加载图标，并且第一个ajax调用仍然在后台进行。当第一个ajax调用完成时，即使该自动完成实例已被破坏，回调也会删除CURRENT实例的'ui-autocomplete-loading'类，并且图标会消失，即使当前的自动完成仍然在场景。

是否真的没有办法取消自动完成，或者更好的是取消基础的ajax调用？

Answer 1

使用禁用，不要销毁它

如果您打算再次使用输入，请在模糊时禁用它。

您还可以设置超时，以使jQuery“杀死”其他请求：

             $('#myinput').autocomplete({
                delay: 250,
                source: function(request, response) {
                    $.ajax({
                        url: "cfc/myfunctions.cfc?method=lookup&returnformat=json",
                        dataType: "json",
                        timeout: 5000 //<--- wait five seconds before giving up
                        data: {
                          search: request.term,
                          maxRows: 20
                        },
                        success: function(data) {
                          response(data);
                        }                   
                    })
                },
                change: function(event, ui) {     
                    if (!ui.item) {
                        $(this).val('');
                    }
                }
            });

销毁/创建jquery自动完成

1 个答案:

使用禁用，不要销毁它