使用ajax请求显示进度条进度

Question

当ajax请求触发并完成时,我想用jquery ui进度条显示进度.问题是我不知道如何根据ajax请求的进度设置进度条的值.这是一个开头的代码:

function ajaxnews()
    {
        $('.newstabs a').click(function(e){
            var section = $(this).attr('id');
            var url = base + 'news/section/' + section;

            $.ajax({
                url : url,
                dataTye : 'html',
                start : loadNews,
                success : fillNews
            });
        });
    }



// start callback functions
   function loadNews()
   {

       $('#progressbar').fadeIn();
       $('#progressbar').progressbar({ //how shoud I set the values here});
   }

   function fillNews()
   {
    $('#progressbar').progressbar('option', 'value', ?? /* how do I find this?*/);   
    $('#progressbar').fadeOut();
   }

Answer 1

根本问题在于您不知道请求需要多长时间.

对于进度条,您需要设置百分比或已完成步骤的数量.

如果您不希望进度条从0跳到100,则需要在请求完成之前测量完成率.

如果你能猜出它需要多长时间,你可以使用一个计时器让它自动递增到90%,当服务器响应时,将它设置为100%.当然,这是假装它.

如果您有多个请求,则可以使用已完成请求的数量作为百分比.如果它有意义,您可以将单个请求分解为多个,但要仔细考虑它对网络流量和响应时间的影响.不要只是为了进度条这样做.

如果请求确实需要很长时间,您可以启动对服务器的其他请求以查询进度.但这可能意味着服务器端的许多工作.

对不起,但进度条很难......