How to update jQuery Progress bar according to a v

2019-06-10 04:10发布

问题:

I need to fill the progress bar according to the current value of a session variable. The value will be not be constant and is increasing. How to make it load by itself?

<meta charset="utf-8">
    <script>
    $(function() {
        $( "#progressbar" ).progressbar({
            value: 80
        });
    });
    </script>
 <div class="demo">

<div id="progressbar"></div>

</div>

回答1:

PHP

...
// disable caching
header('Last-Modified: ' . gmdate('D, d M Y H:i:s') . ' GMT');
header('Cache-Control: no-cache, must-revalidate');
header('Pragma: no-cache');
header('Expires: Mon, 26 Jul 1991 05:00:00 GMT');  // disable IE caching
header('Content-Type: text/plain; charset=utf-8');

echo progressbar_value;
exit();
...

JS

var refresh_period = 1000; // ms
var script_path = '/script.php';

function updateProgressBar () {
    $.ajax({url: script_path,  success: function (value) {
       $('#progressbar').progressbar(value);
       if (data.value == 100) {
          clearInterval(interval);
       }
    }
}
var interval = setInterval('updateProgressBar()', refresh_period);


回答2:

You'll need to use AJAX to talk to a PHP file that echos the session var. It can then update the progress bar.