0

我试图在进行 ajax 调用以获取信息时显示“请稍候...”消息。基本上,用户输入他们的搜索词,点击搜索,我想在页面执行 ajax 调用时显示“请稍候...”,然后在完成后将其隐藏。

我的 jsp 页面上有一个 div,如下所示:

<div id="modalWindow">Please Wait...</div>

我的 jQuery 看起来像这样:

jQuery('#modalWindow').css({
    'text-align' : 'center',
    'font-size' : '20px'
}).hide();  //this is called when the page initially loads

jQuery('#modalWindow').show();    //I call this in the function that does the Ajax call

jQuery('#modalWindow').hide();    //I call this once the Ajax is done.

这是我的整个 Ajax 调用:

jQuery.ajax(
{
    url : urlContext + "/getItems.html",
    data :
    {
        txtItemReference : txtItemReference
    },
    dataType : "json",
    cache : false,
    async : false,
    timeout : 100000,
    success : function(jsonResponse)
    {
        if ( jsonResponse instanceof Object)
        {
            if (jQuery.isEmptyObject(jsonResponse))
            {
                createLocationDisplayPanel(false);
                createSimilarItemsPanel(false);
            }
            else if (jsonResponse['Locations'] != undefined)
            {
                responseArray = new Array();
                arrayStart = 0;
                intPage = 1;

                if (jsonResponse['Locations'].length <= 20)
                {
                    for (var x = arrayStart; x < jsonResponse['Locations'].length; x++)
                    {
                        responseArray[x] = jsonResponse['Locations'][x];
                    }
                }

                else
                {
                    responseArray = new Array();

                    for (var x = arrayStart; x < (20 * intPage); x++)
                    {
                        responseArray[x] = jsonResponse['Locations'][x];
                    }
                }

                createLocationDisplayPanel(jsonResponse, responseArray, txtItemReference, urlContext, callback);
            }
            else
            {
                if (jsonResponse['Items'].length <= 20)
                {
                    for (var x = arrayStart; x < jsonResponse['Items'].length; x++)
                    {
                        responseArray[x] = jsonResponse['Items'][x];
                    }
                }

                else
                {
                    for (var x = arrayStart; x < (20 * intPage); x++)
                    {
                        responseArray[x] = jsonResponse['Items'][x];
                    }
                }

                createSimilarItemsPanel(jsonResponse, responseArray, txtItemReference, urlContext, callback);
            }
            if (callback != undefined)
            {
                callback();
            }
        }
        else
        {
            alertLogout(document.URL);
        }
    },
    error : function(jsonResponse)
    {
        if (jsonResponse.hasOwnProperty('ERROR'))
        {
            alertError("There was no response from the server.");
        }
    }
});

这在我桌面上的 Firefox 以及 Android 的 Firefox 中完美运行。但是,在我尝试过的每个 Android 浏览器上,“请稍候...”文本永远不会显示,我感到很沮丧。谁能告诉我让 show() 和 hide() 函数在 Android 浏览器中工作的解决方法?谢谢。

4

2 回答 2

0

我发现问题出在 Ajax 调用的 async 属性上:

jQuery.ajax(
{
    url : urlContext + "/getItems.html",
    data :
    {
        txtItemReference : txtItemReference
    },
    dataType : "json",
    cache : false,
    async : true,   //was false before
    timeout : 100000,
    success : function(jsonResponse)
    {
        if ( jsonResponse instanceof Object)
        {
            if (jQuery.isEmptyObject(jsonResponse))
            {
                createLocationDisplayPanel(false);
                createSimilarItemsPanel(false);
            }
            else if (jsonResponse['Locations'] != undefined)
            {
                responseArray = new Array();
                arrayStart = 0;
                intPage = 1;

                if (jsonResponse['Locations'].length <= 20)
                {
                    for (var x = arrayStart; x < jsonResponse['Locations'].length; x++)
                    {
                        responseArray[x] = jsonResponse['Locations'][x];
                    }
                }

                else
                {
                    responseArray = new Array();

                    for (var x = arrayStart; x < (20 * intPage); x++)
                    {
                        responseArray[x] = jsonResponse['Locations'][x];
                    }
                }

                createLocationDisplayPanel(jsonResponse, responseArray, txtItemReference, urlContext, callback);
            }
            else
            {
                if (jsonResponse['Items'].length <= 20)
                {
                    for (var x = arrayStart; x < jsonResponse['Items'].length; x++)
                    {
                        responseArray[x] = jsonResponse['Items'][x];
                    }
                }

                else
                {
                    for (var x = arrayStart; x < (20 * intPage); x++)
                    {
                        responseArray[x] = jsonResponse['Items'][x];
                    }
                }

                createSimilarItemsPanel(jsonResponse, responseArray, txtItemReference, urlContext, callback);
            }
            if (callback != undefined)
            {
                callback();
            }
        }
        else
        {
            alertLogout(document.URL);
        }
    },
    error : function(jsonResponse)
    {
        if (jsonResponse.hasOwnProperty('ERROR'))
        {
            alertError("There was no response from the server.");
        }
    }
});

一旦我改变了它,显示和隐藏就可以在 Android 中运行。谢谢你们的帮助。

于 2013-01-30T20:03:27.780 回答
0

您是否检查过当时是否加载了 jQuery?在你的脚本之前写下这个。

if (typeof jQuery == 'undefined') {  
    alert('jQuery is not loaded'); 
}

您可能需要组合脚本或找到一种方法来确保它们按您需要的顺序加载。

于 2013-01-30T18:56:37.590 回答