文件上传进度upload_progress

前端:
<form id="upload-form" action="upload.php" method="POST" enctype="multipart/form-data">
        <input type="hidden" name="<?php echo ini_get("session.upload_progress.name"); ?>" value="test" />
        <p><input type="file" name="file1" /></p>
        <p><input class="sub" type="submit" /></p>
</form>
<div id="progress" class="progress" style="margin-bottom:15px;">
    <div class="label">0%</div>
</div>

<script type="text/javascript">
        $('.sub').click(function(){
            setTimeout('get_progress()', 100);
        })

        function get_progress(){
            $.ajax({
                url: "progress.php",    //请求的url地址
                dataType: "json",   //返回格式为json
                async: true, //请求是否异步,默认为异步,这也是ajax重要特性
                data: { "<?php echo ini_get("session.upload_progress.name"); ?>": "test" },    //参数值
                type: "POST",   //请求方式
                success: function(req) {
                    $('.label').html(req+"%");
                    if(req < 100){
                        setTimeout('get_progress()', 100);    //当上传进度小于100%时,显示上传百分比
                    }else{
                        $('#progress .label').html('完成!'); //当上传进度等于100%时,显示上传完成
                    }
                },
                error: function() {
                    alert(0);
                }
            });
        }
</script>


后台:
----upload.php----
<?php
if(is_uploaded_file($_FILES['file1']['tmp_name'])){                                         
     move_uploaded_file($_FILES['file1']['tmp_name'], "./{$_FILES['file1']['name']}"); 
}
?>

----progress.php----
<?php
session_start();
$i = ini_get('session.upload_progress.name');
$key = ini_get("session.upload_progress.prefix") . $_POST[$i];    
if (!empty($_SESSION[$key])) {            
   //已上传大小
   $current = $_SESSION[$key]["bytes_processed"];
   //文件总大小
   $total = $_SESSION[$key]["content_length"];
   //向 ajax 返回当前的上传进度百分比。
   echo $current < $total ? ceil($current / $total * 100) : 100;
}else{
   echo 100;                                                       
}
?>













猜你喜欢

转载自blog.csdn.net/u014391889/article/details/81206574