异步上传文件并显示进度

<?php
    if(@$_POST['submit']){
        $file = $_FILES['file'];
        $res = move_uploaded_file($file['tmp_name'],$file['name']);
    }
?>
<script src="jquery-1.8.3.min.js" type="text/javascript"></script>
<script>
    $(function(){
        $("#submit").click(function(){
            var data = new FormData();
            data.append("file",$("#file")[0].files[0]);    
            data.append("submit","submit");        
            $.ajax({
                type:"post",
                url:"",
                enctype:"multipart/form-data",
                contentType:false,
                processData:false,
                DataType:"json",
                data:data,
                xhr:function(){                        
                    myXhr = $.ajaxSettings.xhr();
                    if(myXhr.upload){ 
                        myXhr.upload.addEventListener('progress',function(e){                            
                            var loaded = e.loaded;  
                            var total = e.total;  
                            var percent = Math.floor(100*loaded/total)+"%"; 
                            $("#jindu span").text(percent);                                                                              
                        }, false); 
                    }
                    return myXhr;
                },  
                success:function(data){
                    console.log("成功");
                },
                error:function(data){
                    console.log("失败");
                }
            })
        })    
    })
</script>
<form action="" method="post" enctype="multipart/form-data">
    <input type="file" id="file" name="file" />
    <button type="submit" id="submit">提交</button>
</form>
<div id="jindu">进度:<span>0</span></div>

js 自己加载