ajaxStart取消jQuery自动完成

Question

我正在实现ajaxStart事件，以显示一个模态语句"loading"。

但是，最大的问题是这种模式与jQuery Autocomplete冲突，只是没有显示自动完成的结果列表。

我的自动完成是：

$("#txtInput").autocomplete({
    minLength: 3,
    source: "autocomplete" , 
    multiple: true,
    select: function( event, ui ) {
        $( "#cie" ).val( ui.item.label );
        $("#id").val(ui.item.id);
        $("#addItem").prop('disabled', false);
        return false;
    }
});

我用这个处理Ajax事件：

$("#dlgWait").ajaxStart(function(){                    
    $("#dlgWait").dialog('open');    
});
$("#dlgWait").ajaxComplete(function(){
    $("#dlgWait").dialog('close');    
});

如何禁用此模式以自动完成或以某种方式避免此问题？

Answer 1

如果您使用$().dialog()所要做的只是显示一条消息，上面写着"Loading"，我建议使用另一种方法来显示该消息。

当你可以做这样的事情时，jQueryUI dialog（）函数只是显示消息"Loading"有点过头了：

HTML

<div class="dlgLoading" id="dlgWait">Loading...</div>

CSS

div.dlgLoading {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-color:rgba(255,255,255,0.95);
    text-align: center;
    display: none;
    z-index: 100;
}

JS-

$('#ajax').ajaxStart(function(){
    $('#dlgWait').show();
});
$('#ajax').ajaxComplete(function(){
    $('#dlgWait').hide();
});

Answer 2

如果有人发现了这一点（就像我一样），并且真的想知道为什么这不起作用，那是因为当你使用对话框（"打开"）时，对话框总是将焦点从文本框上移开。