ajaxStart取消jQuery自动完成

时间:2013-07-16 20:19:11

标签: javascript jquery jquery-ui

我正在实施ajaxStart事件以显示模式说“加载”。

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

我的自动填充功能是:

$("#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');    
});

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

2 个答案:

答案 0 :(得分:2)

如果您使用$().dialog()所做的只是显示“正在加载”的消息,我建议您使用其他方法来显示该消息。

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();
});

答案 1 :(得分:1)

如果有人发现这个(就像我一样),并且真的想知道为什么这不起作用,那是因为当你使用对话框(“打开”)时,对话框总是将焦点从文本框中移开。