6

我正在创建的页面上使用 jquery-ui 自动完成功能。在同一页面上，我正在进行一些 ajax 事件。在其他 ajax 事件期间，我正在向我的页面添加一个覆盖，以便用户不再可以点击网站上的所有链接。我不希望在自动完成期间发生这种情况。

自动完成：

$(function() {
    $( "#search_input" ).autocomplete({
    source: '/search_autocomplete/',});
});

阿贾克斯：

$.ajax({
    url: "/ajax_login/",
            login_user: $("#login_user").val(),
            password: $("#login_password").val(),
            });

ajax开始：

$("#loading_gif").ajaxStart(function() {
    $("#overlay").show();
    $(this).show();
});

防止在不需要的 ajax 事件期间执行 ajaxstart 函数。我加

global:false,

到相应的ajaxfunctions。如何在不更改 jquery-ui 源的情况下在自动完成期间做类似的事情？

4

3 回答 3

6

为此，您必须省略速记调用source并像这样更改调用。

$('#search_input').autocomplete({
    source: function (request, response) {
        var DTO = { "term": request.term };
        //var DTO = { "term": $('#search_input').val() };
        $.ajax({
            data: DTO,
            global: false,
            type: 'GET',
            url: '/search_autocomplete/',
            success: function (jobNumbers) {
                //var formattedNumbers = $.map(jobNumbersObject, function (item) {
                //    return {
                //        label: item.JobName,
                //        value: item.JobID
                //    }
                //});
                return response(jobNumbers);
            }
        });
    }
    //source: '/search_autocomplete/'
});

这种长手方法的优点是

  1. 您可以传递多个参数。此外，参数名称不必是术语。
  2. 简写符号需要一个字符串数组。在这里，您也可以返回一个对象数组。
于 2013-08-25T07:37:23.543 回答
1

我同意naveen的答案是最好的解决方案。就我而言，需要更改的大量代码并不划算，因为我们正在重写，我们需要一个短期解决方案。

您可以在 jQuery UI 中覆盖 ajax 调用，我复制了处理 AJAX 请求的 _initSource 函数调用的源代码。然后简单地将 global: false 添加到 $.ajax 选项中。这里的代码基于 jquery-ui 1.9.2，你可能需要为你的版本找到正确的源代码。

$.ui.autocomplete.prototype._initSource = function () {
    var array, url,
        that = this;
    if ( $.isArray(this.options.source) ) {
        array = this.options.source;
        this.source = function( request, response ) {
            response( $.ui.autocomplete.filter( array, request.term ) );
        };
    } else if ( typeof this.options.source === "string" ) {
        url = this.options.source;
        this.source = function( request, response ) {
            if ( that.xhr ) {
                that.xhr.abort();
            }
            that.xhr = $.ajax({
                url: url,
                data: request,
                dataType: "json",
                global: false,
                success: function( data ) {
                    response( data );
                },
                error: function() {
                    response( [] );
                }
            });
        };
    } else {
        this.source = this.options.source;
    }
};
于 2013-11-19T23:26:58.540 回答
1

如果您大部分$.ajax()时间都想以某种方式工作，但现在一直都是，那么您可能不应该更改其默认行为。

我建议创建一个函数，将 ajax 请求包装在一个函数中，该函数在适当的时间启用和禁用覆盖。在您希望使用叠加层的位置调用此函数，并使用 plain$.ajax()进行自动完成。

于 2012-04-09T23:10:56.543 回答