Question

我必须在我的网页上添加一个进度条以显示提交的进度。我的提交页面将数据保存在数据库中。我必须向用户显示提交的持续时间。例如，50％已完成等等..

Answer 1

您可以使用jQuery和延长彩色div长度的计时器来模拟它。不是真正的服务器端真正的控制，但足以让访客满意。可以根据用户必须执行的操作来计算时间和间隔。

通常，对于用户体验，进度条移动本身的外观，更重要的是它达到100％的事实（如果操作在100％之前没有完全完成，通常是坏的）。

[加入]

你必须

使用

附加jquery脚本库

<script src="http://code.jquery.com/jquery-1.5.1.min.js" type="text/javascript"></script>

放置并指向样式化的html控件

<div style="height:20px;width:200px;background-color:#777" id="somediv"></div>

指向它并使用javascript / jquery

影响它

<script type="text/javascript"> 
  var width = 10;

  $(document).ready(function() {
      setTimeout("$('somediv').html('width,'" + width+10 + "')", 600);
  });

</script>

请理解这是一种类型的伪代码（不完全复制可用）以了解我的描述。 setTimeout javascript函数会使每个间隔的div更大。就像每次添加10px一样，这样可以重复使用变量进行文本描述。

Answer 2

为了显示更新过程的进度，您需要发送部分更新，指示到目前为止已完成的总百分比。

所以更适用的解决方案是使用类似jQuery UI ProgressBar的东西，并有一个机制将上述百分比发送给用户，然后用最后发送的值更新进度条。

您可以查看以下文章了解更多详情：

Using the jQuery ProgressBar Widget in ASP.NET Applications

Reporting server side operation progress with jQuery UI Progressbar

Answer 3

我在这里看到两种方式，首先，当你要进行异步请求时，你可以测量它平均需要多长时间（10秒）并使用这个值来衡量我们现在的距离。第二种方式更适合大量数据上传。您需要数据库和应用程序支持并使用批量上传数据。然后，您可以衡量您拥有的数据量以及提交的时间。

asp.net网页上的进度条

3 个答案: