如何在 Web 应用程序 C# 中使用进度条，无需 ajax 工具答案

【问题标题】：how to use progress bar in web application c#, without ajax tools如何在 Web 应用程序 C# 中使用进度条，无需 ajax 工具
【发布时间】：2009-08-05 06:32:00
【问题描述】：

如何在没有 ajax 工具的情况下在 web 应用程序 c# 中使用进度条...当我从一页单击到下一页时..页面加载应显示为进度条..任何人都可以帮忙，没有 ajax工具..

提前谢谢你

【问题讨论】：

标签： c# asp.net progress-bar

【解决方案1】：

我认为你仍然需要 javascript 但不需要使用 AJAX 更新面板。

在您的页面上添加一个带有进度动画图片
使用 CSS 将 div 设置为隐藏
在您的链接按钮/按钮上或无论如何，链接您的 onClick 事件正常
在同一个链接按钮/按钮上添加一个 onClientClick 属性并调用设置div的javascript函数样式可见

这实际上会显示进度表，直到页面实际回发。

连线按钮

 <asp:Button ID="btnProgress" runat="server" Text="show progress" OnClientClick="javascript:DisplayProgress()" OnClick="btnProgress_Click"
            CausesValidation="false" />

进度表分区

    <div ID="pnlProgress" Class="modalBackground" style="visibility: hidden;">
        <div id="content" class="modalDialogClear" style="text-align: center; " > 
        <br />
        <br />
    looking up address, please wait...<br />
    <img src="/images/progress_bar.gif" />
    </div>

Javascript

  function DisplayProgress()
        {
            document.getElementById('pnlProgress').style.visibility = 'visible';
            window.setTimeout(HideProgressPanel, 20000);  //handles hiding the progress panel should the operation time out
        }

    function HideProgressPanel()
    {
    document.getElementById('pnlProgress').style.visibility = "hidden", 20000
    }

【讨论】：

【解决方案2】：

我是这样做的，当页面加载时，在加载完成之前我显示进度条......

<body onload="javascript:HidePreloader();">

 <div id="preloader" style="width: 100%; text-align: center;">
                    <img src="../Images/loading.gif" alt="" style="display: block;" />
                </div>

<script language="javascript" type="text/javascript">
    function HidePreloader() {
        if (document.getElementById('preloader') != null) {
            document.getElementById('preloader').style.visibility = 'hidden';

        }
    }
</script>

【讨论】：

问题是“没有 ajax 工具”