Question

我的项目出了问题。我有2个网页，输入的网页xxx和输出的网页yyy。处理时间需要2分钟，所以点击网页xxx上的按钮后，显示白色，等待处理完成并显示网页yyy。

如何用加载图像替换白色空白并在网页yyy处理完毕后消失？我已做过一些研究，示例就像这段代码

function onReady(callback) {
var intervalID = window.setInterval(checkReady, 60000);

function checkReady() {
if (document.getElementsByTagName('body')[0] !== undefined) {
    window.clearInterval(intervalID);
    callback.call(this);
       }
   }
}

示例来自此网站http://jsfiddle.net/MrPolywhirl/cbLsc81f/

在哪里放置代码和CSS来显示加载屏幕？在网页xxx或网页yyy？

我对如何将js实现到我的项目感到困惑。我需要你的帮助

提前谢谢。

更新。

此代码是我从xxx

    public void GenerateReport() 
    {

        System.Collections.Specialized.NameValueCollection collections = new System.Collections.Specialized.NameValueCollection();

        collections.Add("ID", Session["ID"].ToString());

        string remoteUrl = "WebfrmReport.aspx";
        string html = "<html><head>";
        html += "</head><body onload='document.forms[0].submit()'>";
        html += string.Format("<form name='PostForm' method='POST' action='{0}' style='display:none;'>", remoteUrl);
        foreach (string key in collections.Keys)
        {
            html += string.Format("<input name='{0}' type='text' value='{1}'>", key, collections[key]);
        }
        html += "</form></body></html>";
        Response.Clear();
        Response.ContentEncoding = Encoding.GetEncoding("ISO-8859-1");
        Response.HeaderEncoding = Encoding.GetEncoding("ISO-8859-1");
        Response.Charset = "ISO-8859-1";
        Response.Write(html);
        Response.End();
    }

Answer 1

试试这个：

<div class="ui-widget-overlay">
    <div id="loadingDivId">
        <img src="~/Content/Images/loading.gif" />
    </div>
</div>

function DisablePage() {
    $('.ui-widget-overlay').css('height', '100%');
}
function EnablePage() {
    $('.ui-widget-overlay').css('height', '0%');
}
$(document).ajaxStart(function () {
    DisablePage（）;
});
$(document).ajaxStop(function () {
    EnablePage();
Redirect to yyy
});
function GenerarteReport() {
    var url = urlHelper.CommonHelper("", "Home", "GenerateReport");
    $.ajax({
        url: url,
        dataType: "json",
        ype: "GET",
       contentType: 'application/json; charset=utf-8',
        async: true,
      processData: false,
       cache: false,
        success: function (data) {
          if(data.success)
            alert("success");
            else
                alert("not success")
        }
    });
}

public JsonResult GenerateReport()
{
System.Collections.Specialized.NameValueCollection collections = new System.Collections.Specialized.NameValueCollection();

    collections.Add("ID", Session["ID"].ToString());

    string remoteUrl = "WebfrmReport.aspx";
    string html = "<html><head>";
    html += "</head><body onload='document.forms[0].submit()'>";
    html += string.Format("<form name='PostForm' method='POST' action='{0}' style='display:none;'>", remoteUrl);
    foreach (string key in collections.Keys)
    {
        html += string.Format("<input name='{0}' type='text' value='{1}'>", key, collections[key]);
    }
    html += "</form></body></html>";
    Response.Clear();
    Response.ContentEncoding = Encoding.GetEncoding("ISO-8859-1");
    Response.HeaderEncoding = Encoding.GetEncoding("ISO-8859-1");
    Response.Charset = "ISO-8859-1";
    Response.Write(html);
    Response.End();
    return Json(new { success = true }, JsonRequestBehavior.AllowGet);
}

单击按钮和页面加载后显示加载图像

1 个答案: