Question

如何在我的网页加载时在屏蔽的屏幕上显示简单的加载消息。

我有一个产品比较页面，点击按钮即可调用。现在，比较页面需要大约4秒才能加载。这是因为存储过程大约需要3.5秒才能返回结果。

因此，在用户单击按钮后的4秒内，我们会看到前一个屏幕，标签上只有微调器，表示页面正在被重定向。是否有任何方法可以显示页面掩码，其中当前页面在加载下一页之前被涂黑。

我重定向到比较页面的方式是c＃功能

protected void redirect_comparepage(object sender, EventArgs e)
{
    Response.Redirect("~/ProductComparison.aspx", false);
}

我尝试在比较页面上执行以下操作，但它不起作用。

How to display a loading screen while site content loads 有什么建议吗？

Answer 1

这样的事情怎么样？我用了一点jQuery。

将OnClientClick添加到按钮控件以启动魔法......

<asp:Button runat="server" ID="SubmitButton" Text="Submit" 
OnClientClick="pleaseWait();" />

包含这些新的HTML元素以使屏幕变暗并在其中间放置一个“PLEASE WAIT”。确保这些元素中使用的z-index高于页面上的任何其他值。 1000＆amp; 1001应该做得很好......

<div id="modal" class="modal" style="background-color:rgba(64,64,64,0.5);width:100%;height:100%;z-index:1000;display:none">
</div>
<div id="wait" class="modal" style="width:300px;height:200px;margin:100px auto 0 auto;display:none;background-color:#fff;z-index:1001;text-align:center;">
    PLEASE WAIT...
</div>

这是OnClientClick函数。它只是使用JQuery来显示HTML元素......

function pleaseWait(){
    $(".modal").show();
    return true; // Can't remember if this is needed; but it won't hurt.
}

因此，当您单击启动长数据处理的按钮时，页面将变暗并且中间会出现“PLEASE WAIT”，直到刷新为止。

如果你不使用或不想使用jQuery，你的pleaseWait（）函数看起来会像这样......

function pleaseWait(){
    document.getElementById("modal").style.display = "block";
    document.getElementById("wait").style.display = "block";
    return true; // Can't remember if this is needed; but it won't hurt.
}

Answer 2

您可以使用多线程来实现此目的。

private void ThreadCall(){
            Thread thread = new Thread(new ThreadStart(FetchData));
            thread.Start();
        }
        private void FetchData(){
            //your code here
        }

将您的提取代码放在FetchData（）中，只需从主函数调用ThreadCall（）即可。

如果您提供有关问题的代码和更多信息，可以给出更好的答案。

当我的页面从服务器获取数据时，如何在屏幕上显示简单的加载消息？

2 个答案: