Javascript Jquery进度条阻止PHP文件上传？

我有一个PHP上传表单，用于将视频文件上传到我的服务器。在我添加Jquery/Ajax进度条之前，它工作得非常好。进度条看起来很棒，似乎工作正常。唯一的问题是，在我添加了这段代码之后，我的PHP实际上并没有将文件移动到我的服务器上，尽管在我添加进度条之前它工作得很好。代码中是否有我需要更正的内容，以便PHP上传真正完成

<!--Progress bar code -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    // File upload via Ajax
    $("#introUploadForm").on('submit', function(e){
        e.preventDefault();
        $.ajax({
            xhr: function() {
                var xhr = new window.XMLHttpRequest();
                xhr.upload.addEventListener("progress", function(evt) {
                    if (evt.lengthComputable) {
                        var percentComplete = Math.round(((evt.loaded / evt.total) * 100));
                        $(".progress-bar").width(percentComplete + '%');
                        $(".progress-bar").html(percentComplete+'%');
                    }
                }, false);
                return xhr;
            },
            type: 'POST',
            url: 'vidUpload.php',
            data: new FormData(this),
            contentType: false,
            cache: false,
            processData:false,
            beforeSend: function(){
                $(".progress-bar").width('0%');
                $('#uploadStatus').html('<img src="images/loading.gif"/>');
            },
            error:function(){
                $('#uploadStatus').html('<p style="color:#EA4335;">File upload failed, please try again.</p>');
            },
            success: function(resp){
                if(resp == 'ok'){
                    $('#uploadForm')[0].reset();
                    $('#uploadStatus').html('<p style="color:#28A74B;">File has uploaded successfully!</p>');
                }else if(resp == 'err'){
                    $('#uploadStatus').html('<p style="color:#EA4335;">Please select a valid file to upload.</p>');
                }
            }
        });
    });
    
});

$（文档）.ready（函数（）{
//通过Ajax上传文件
$（“#introUploadForm”）。在（'submit'，函数（e）上{
e、 预防默认值（）；
$.ajax({
xhr:function（）{
var xhr=new window.XMLHttpRequest（）；
xhr.upload.addEventListener（“进度”，函数（evt）{
if（evt.长度可计算）{
var percentComplete=数学整轮（（evt.loaded/evt.total）*100）；
$（“.progress bar”）.width（完成百分比+“%”）；
$（“.progress bar”）.html（完成百分比+“%”）；
}
}，假）；
返回xhr；
},
键入：“POST”，
url:'vidUpload.php'，
数据：新表单数据（本），
contentType:false，
cache:false，
processData:false，
beforeSend:function（）{
$（“.progress bar”）.width（'0%”）；
$（'#uploadStatus'）.html（''）；
},
错误：函数（）{
$（“#uploadStatus”）.html（“
文件上载失败，请重试。
”；
},
成功：功能（resp）{
如果（resp=='ok'）{
$（'#uploadForm'）[0].reset（）；
$（“#uploadStatus”）.html（“
文件已成功上载！
”；
}否则如果（resp=='err'）{
$（“#uploadStatus”）.html（“
请选择要上载的有效文件。
”；
}
}
});
});
});

这是否有帮助：是否收到错误消息？检查Chrome开发者工具的“网络”选项卡。在添加进度条之前，您的代码是什么样子的？