如何从ajax循环创建进度条？

我的服务器端数据如下：如何从ajax循环创建进度条？

$total=100; 
$jd=array(); 
for($i=1;$i<=$total; $i++){ 
    $jd["current_value"]=$i; 
    $jd["total"]=$total; 
    $jd["some_extra_data"]="Extra data-$i"; 
    echo json_encode($jd); 
    sleep(1); 
}

现在我想创建一个从上述AJAX请求数据的进度条。

但我没有从请求中获取单个数据。所有的时间，我获得完整的数据所以，我不能创建一个进度条。我该如何申请？请给我。谢谢。

来源

2015-03-25 Ahosan Karim Asik

如果您对使用JS库不太反感，那么您可以考虑使用JQuerys UI库。

http://jqueryui.com/progressbar/

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Progressbar - Default functionality</title> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
    <script> 
    $(function() { 
    $("#progressbar").progressbar({ 
     value: 50 
    }); 
    }); 
    </script> 
</head> 
<body> 
    <div id="progressbar"></div> 
</body> 
</html>

如果你将它与JQuery的Ajax请求相结合，那么你应该能够达到你所追求的：http://api.jquery.com/jquery.ajax/

然后，您可以定期调用服务器端页面获得一个值来填充进度条。

让我知道，如果这是直接的方向，我可以阐述，如果需要的话。

来源

2015-03-25 11:02:49 Opentuned

如何从ajax循环创建进度条？

回答

相关问题