Jquery自动完成插件不显示成功响应

Question

我正在使用这样的 jquery 自动完成插件

$( "#city" ).autocomplete({
            source: function( request, response ) {
                $.ajax({
                    url: "http://www.abc.com/test.php",
                    dataType: "jsonp",
                    data: {
                        featureClass: "P",
                        style: "full",
                        maxRows: 12,
                        name_startsWith: request.term
                    },
                    success: function( data ) {
                        alert("hello");
                    }
                });
            },
            minLength: 2,
            select: function( event, ui ) {
                log( ui.item ?
                    "Selected: " + ui.item.label :
                    "Nothing selected, input was " + this.value);
            },
            open: function() {
                $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
            },
            close: function() {
                $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
            }
        });

我没有收到任何关于成功的警告框。

firefox 显示我得到这个作为响应

[{"label":"mark2","value":1},{"label":"abc1","value":20}]

它是否期望其他任何回报

Answer 1

鉴于example you've taken this from 工作正常，并且使用jsfiddle 复制相同的示例按预期工作，你的那个不工作的原因很可能是你的页面其他地方有一个javascript错误，它正在停止进一步的javascript执行.

另外，我复制了这个例子，只是在成功回调中添加了一个 alert - 这也是 works fine 但是你应该注意 jQueryUI 自动完成的文档指出：

在请求期间提供自定义源回调以处理错误时，这一点很重要。 即使遇到错误，您也必须始终调用响应回调。这可确保小部件始终具有正确的状态。

这不是你的错误，但值得注意！

---

编辑 我突然想到，如果您的 ajax 调用实际上正在生成服务器端错误 (http500)，那么您将永远不会输入 success 回调，也永远不会收到警报。尝试在 ajax 调用中添加错误回调，看看是否是这种情况：

$.ajax({
    url: "http://www.abc.com/test.php",
    dataType: "jsonp",
    data: {
        featureClass: "P",
        style: "full",
        maxRows: 12,
        name_startsWith: request.term
    },
    success: function( data ) {
        alert("hello");
    },
    error: function (xhr, textStatus, errorThrown){
        alert("error: " + errorThrown);
    }
});