jQuery 阻止 UI 异常

发布于 2024-08-28 18:36:32 字数 254 浏览 8 评论 0原文

我正在使用 JQuery UI 插件 blockUI 来阻止每个 ajax 请求的 UI。它的工作原理就像一个魅力，但是，当我进行 ajax 调用以获取自动完成建议项目时，我不想阻止 UI（或者至少不显示“请稍候”消息）。我该怎么做？我正在使用 jquery 自动完成插件来实现自动完成功能。

有没有办法告诉阻止 UI 插件不阻止 UI 进行自动完成？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

ぃ双果 2024-09-04 18:36:32

$('#myWidget').autocomplete({
    source: function(data, callback) {
        $.ajax({
            global: false,  // <-- this is the key!
            url: 'http:...',
            dataType: 'json',
            data: data,
            success: callback
        });
    }
});

$('#myWidget').autocomplete({
    source: function(data, callback) {
        $.ajax({
            global: false,  // <-- this is the key!
            url: 'http:...',
            dataType: 'json',
            data: data,
            success: callback
        });
    }
});

回复收藏 0 原文

时光暖心i 2024-09-04 18:36:32

嗯，看起来 jquery 中缺少一个功能:)
您可以使用全局标志来指示它是否是自动完成调用并将其包装在通用的自动完成函数中

    var isAutoComplete  = false;
    function autoComplete(autocomplete){
    isAutoComplete = true;
    if($(autocomplete).isfunction())
       autocomplete();
    }

        $(document).ajaxStart(function(){if(!isAutoComplete)$.blockUI();}).ajaxStop(function(){isAutoComplete = false;$.unblockUI();});

这不是一个很好的解决方案，但它应该可以工作......

Hm, looks to be a missing feature in jquery :)
You could use a global flag to indicate if it is a autocomplete call and wrap it in a general autcompletefunction

    var isAutoComplete  = false;
    function autoComplete(autocomplete){
    isAutoComplete = true;
    if($(autocomplete).isfunction())
       autocomplete();
    }

        $(document).ajaxStart(function(){if(!isAutoComplete)$.blockUI();}).ajaxStop(function(){isAutoComplete = false;$.unblockUI();});

It's not a nice solution but it should work...

回复收藏 0 原文

蓦然回首 2024-09-04 18:36:32

尝试使用装饰器

$.blockUI = function() {
    if (condition_you_dont_want_to_block) {
        return;
    }
    return $.blockUI.apply(this, arguments);
}

，或者您可以编写自己的更智能的块函数

function my_blockUI() {
    if (condition_you_dont_want_to_block) {
        return;
    }
    $.blockUI();
}
$(document).ajaxStart(my_blockUI).ajaxStop($.unblockUI);

try using a decorator

$.blockUI = function() {
    if (condition_you_dont_want_to_block) {
        return;
    }
    return $.blockUI.apply(this, arguments);
}

or you can write your own block function that is smarter

function my_blockUI() {
    if (condition_you_dont_want_to_block) {
        return;
    }
    $.blockUI();
}
$(document).ajaxStart(my_blockUI).ajaxStop($.unblockUI);

回复收藏 0 原文

零崎曲识 2024-09-04 18:36:32

您可以通过添加到全局 jQuery 事件处理程序来将 blockUI 设置为适用于页面上的所有功能。为了确保它不会在自动完成 ajax 调用中被调用，我们必须确定该调用是否是自动完成调用。问题是这些全局函数没有那么多可用的信息。然而 ajaxSend 确实得到了一些信息。它获取用于进行 ajax 调用的设置对象。设置对象具有正在发送的数据字符串。因此，您可以做的是附加到页面上每个 ajax 请求中的每个数据字符串，例如：

¬autocomplete=notautocomplete

例如：

$.ajax({data:"bar=1&foo=2¬autocomplete=notautocomplete"})

然后我们可以将此代码放在您的文档准备部分中，然后再进行其他操作：

$(document).ajaxSend(
    function (event, xhr, ajaxOptions){
     if(ajaxOptions.data.indexOf("notautocomplete") !== -1){
         $.blockUI;
     }
});
$(document).ajaxStop($.unblockUI);

当然，另一个更好的想法是寻找自动完成请求中有些独特的东西，例如 url，但这取决于您正在使用的自动完成插件以及如何使用它。

You can set blockUI to work for all functions on the page by adding to a global jQuery event handler. To make sure it doesn't get called on autocomplete ajax calls we have to determine if the call is an autocomplete call or not. The problem is that these global functions don't have that much information available to them. However ajaxSend does get some information. It gets the settings object used to make the ajax call. the settings object has the data string being sent. Therefore what you can do is append to every data string in every ajax request on your page something like:

¬autocomplete=notautocomplete

For example:

$.ajax({data:"bar=1&foo=2¬autocomplete=notautocomplete"})

Then we can put this code in your document ready section before anything else:

$(document).ajaxSend(
    function (event, xhr, ajaxOptions){
     if(ajaxOptions.data.indexOf("notautocomplete") !== -1){
         $.blockUI;
     }
});
$(document).ajaxStop($.unblockUI);

Of course the other better idea would be to look for something unique in the auto complete requests, like the url, but that depends on which autocomplete plug-in you are using and how you are using it.

回复收藏 0 原文