Javascript 使用php上载文件时，引导模式中的加载程序不显示

我有一个模式，用户可以通过它上传PDF文件。模式代码为：

  <div class="modal fade" id="modalUploadFile" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" style="">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="exampleModalLabel"><i class="fa fa-file fa-lg"></i> Nieuw document</h4>
          </div>
          <div class="modal-body">
            <form action="functions/upload_pdf.php" method="post" enctype="multipart/form-data" target="uploadTarget" onsubmit="startUpload();">
              <div class="col-md-6">
                <div class="form-group" id="uploadForm" style="visibility: visible;">
                  <label for="recipient-name" class="control-label">Bestand:</label>
                  <input type="file" name="fileToUpload" id="fileToUpload">
                  <!-- <input type="hidden" name="fileLocation" id="fileLocation"> -->
                  <br>
                  <input class="btn btn-success" type="submit" value="Document uploaden" name="submit">
                </div>
              </div>
              <div class="col-md-6">
                <div id="uploadProcess" class="text-center" style="width: 100%; visibility: hidden;"><img src="images/loaders/loader_1.gif" /></div>
              </div>
              <iframe id="uploadTarget" name="uploadTarget" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
            </form>
          </div>
          <div class="modal-footer">
            <!-- <button type="submit" class="btn btn-success" onclick="insertMsgProc();">Plaats bericht</button> -->
          </div>
        </div>
      </div>
  </div>

stopUpload（）功能：

function startUpload(){
    $('#uploadProcess').style.visibility = 'visible';
    $('#uploadForm').style.visibility = 'hidden';

    return true;
}

function stopUpload(success){

    var result = '';

    if (success == 1){
       result = '<span class="sucess-msg">Document succesvol ge-upload.<\/span><br/><br/>';
    } else {
       result = '<span class="error-msg">Er is iets mis gegaan tijdens het uploaden.<\/span><br/><br/>';
    }

    $('#uploadProcess').style.visibility = 'hidden';
    $('#uploadForm').innerHTML = result;
    $('#uploadForm').style.visibility = 'visible';      

    return true;   
}

执行代码时，将上载所选文件，但不显示loader_1.gif。此外，按钮没有释放，因此代码似乎在某些地方无法继续

非常感谢您的帮助。
让我简单地让您了解使用jquery上传的逻辑

  <div id="loadergif"><img src="<?php echo ASSETS_URL; ?>admin/images/ajax-loader.gif" height="40" width="40" id="loadergif"/></div>

<script>
        $(document).ready(function(){
            $("#loadergif").hide();
            $('#upload_form').on('submit',function(){               
                if($('#upload_form').valid()){
                    $("#form-container").hide();
                    $("#loadergif").show(); 
                }
            });
</script>

admin/images/ajax loader.gif“height=“40”width=“40”id=“loadergif”/
$（文档）.ready（函数（）{
$（“#loadergif”）.hide（）；
$（'#upload_form'）。在（'submit'，function（）{
如果（$（'#上传表单'）。有效（）{
$（“#表单容器”）.hide（）；
$（“#loadergif”）.show（）；
}
});

其中，
#upload_form
是您要上传的表单。
当您单击按钮时，
是否更改为
？
所以我现在一切都正常了。在此，我发布了我的带有代码的总体解决方案。这可能对其他人有帮助：

html
表单：

  <div class="modal fade" id="modalUploadFile" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" style="">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="exampleModalLabel"><i class="fa fa-file fa-lg"></i> Nieuw document</h4>
          </div>
          <div class="modal-body">
            <form action="functions/upload_pdf.php" method="post" enctype="multipart/form-data" target="uploadTarget" onsubmit="startUpload(); this.blur();">
              <div class="col-md-6">

                <input type="hidden" name="fileToDelete" id="fileToDelete">

                <div class="form-group" id="uploadForm" style="">
                  <label for="recipient-name" class="control-label">Bestand:</label>
                  <input type="file" name="fileToUpload" id="fileToUpload" style="width: 100%;">
                  <hr>
                  <input class="btn btn-success" id="btn-upload-doc" type="submit" value="Document uploaden" name="submit">'
                </div>
              </div>
              <div class="col-md-6">
                <div id="uploadProcess" class="text-center" style="width: 100%;"><img src="images/loaders/loader_1.gif" /></div>
              </div>
              <iframe id="uploadTarget" name="uploadTarget" src="#" style="width:0;height:0;border:0px solid #fff; position: absolute;"></iframe>
            </form>
          </div>
        </div>
      </div>
  </div>

最后是
php
代码：

<?php
session_start();
$target_dir = $_SESSION['upload_dir'];
$target_file = "C:/xampp/htdocs" . $target_dir . basename($_FILES["fileToUpload"]["name"]);
$uploadOk = 1;
$imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);

// Allow only PDF
if($imageFileType != "pdf") {
    //echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
    $uploadOk = 0;
}
// Check if $uploadOk is set to 0 by an error
if ($uploadOk == 0) {
    //echo "Sorry, your file was not uploaded.";
} else {
    if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
        //header('Location: ../portal.php');
        $success = 1;
    } 
}
?>
<script src="../production/products/contractmonitor/js/contractmonitor.js" type="text/javascript">
    stopUpload(<?php echo $success; ?>);
</script>

function startUpload() {
    $('#uploadForm').hide();
    $('#uploadProcess').show();

    return true;
}

function stopUpload(success){

    var result = '';

    if (success == 1) {
       result = '<span class="label label-success" style="font-size: 13px;">Upload succesvol</span>';
    } else {
       result = '<span class="label label-warning" style="font-size: 13px;">Er is iets mis gegaan tijdens de upload</span>';
    }

    $('#uploadProcess').hide();
    $('#uploadForm').html(result);
    $('#uploadForm').show();


    return true;   
}

<?php
session_start();
$target_dir = $_SESSION['upload_dir'];
$target_file = "C:/xampp/htdocs" . $target_dir . basename($_FILES["fileToUpload"]["name"]);
$uploadOk = 1;
$imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);

// Allow only PDF
if($imageFileType != "pdf") {
    //echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
    $uploadOk = 0;
}
// Check if $uploadOk is set to 0 by an error
if ($uploadOk == 0) {
    //echo "Sorry, your file was not uploaded.";
} else {
    if (@move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
        //header('Location: ../portal.php');
        $success = 1;
    } 
}
sleep(1);
?>
<script type="text/javascript">
    window.top.stopUpload(<?php echo $success; ?>);
</script>


window.top.stopUpload（）；

我将
window.top.window.stopUpload（）；
更改为
window.top.stopUpload（）；
，因为我的
php
文件位于较低的目录中

谢谢你的帮助。
不，没有。我现在使用
$（'uploadProcess'）.hide（）；
和
$（'uploadProcess'）.show（）；
这很有效。非常感谢。
.hide（）；
和
.show（）；
的使用帮了我的忙。