javascript - 通过javascript将图片上传到服务器

Question

我正在尝试通过 javascript 在服务器上上传文件，

    <script>
    function SubmitFormData9() {
        var fileToUpload1 = $("#fileToUpload1").val();
        var fileToUpload2 = $("#fileToUpload2").val();
        var resumeid9 = $("#resumeid9").val();
        $.post("r_nine.php", { fileToUpload1: fileToUpload1 , fileToUpload2: fileToUpload2 , resumeid9 : resumeid9 },
        function(data) {
         $('#results').html(data);
         $('#myForm9')[0].reset();
        });
    }
    </script>

    <form id="myForm9" method="post" enctype="multipart/form-data">             
    <input class="form-control" type="file" name="fileToUpload1" id="fileToUpload1" >
    <input class="form-control" type="file" name="fileToUpload2" id="fileToUpload2" >
<input id="resumeid9" name="resumeid9" type="hidden" value="<? echo $resumeid;?>"/>
    <input type="button" class="btn btn-rounded btn-primary btn-sm" id="submitFormData9" onclick="SubmitFormData9();" value="Submit" />
    </form>

但我无法将值从表单传递到 r_nine.php 页面

r_nine.php 页面上的代码

   $resumeid9  = $_POST['resumeid9'];   
    $target_dir = "reqdoc/";
    $target_file = $target_dir . basename($_FILES["fileToUpload1"]["name"]);
    $uploadOk = 1;
    $imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);
    $new_filename1 = $target_dir . uniqid() . '.' . $imageFileType;
    if (move_uploaded_file($_FILES["fileToUpload1"]["tmp_name"], $new_filename1))
        {   
            $filee1 = $new_filename1;
        }


    $target_dir = "reqdoc2/";
    $target_file = $target_dir . basename($_FILES["fileToUpload2"]["name"]);
    $uploadOk = 1;
    $imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);
    $new_filename = $target_dir . uniqid() . '.' . $imageFileType;
    if (move_uploaded_file($_FILES["fileToUpload2"]["tmp_name"], $new_filename))
        {   
            $filee = $new_filename;
        }

    $sql1="UPDATE resume set resume='".$filee1."',tracker_file='".$filee."' WHERE id='".$resumeid9."'  ";
   if(mysqli_query($con,$sql1))
      {
        //echo "Files Saved Successfully";
      }
   else
      {
        die('Error:' . mysqli_error($con));
      } 

谁能告诉我如何更正上面的代码，以便我可以上传数据

Answer 1

<script>
    function SubmitFormData9()
    {
        var objFormData = new FormData();
        // APPEND FILE TO POST DATA
        objFormData.append('fileToUpload1', $("#fileToUpload1")[0].files[0]);
        objFormData.append('fileToUpload2', $("#fileToUpload2")[0].files[0]);
        // APPEND TEXT TO POST DATA
        objFormData.append('resumeid9', $("#resumeid9").val());

        $.ajax({
            url: 'r_nine.php',
            type: 'POST',
            contentType: false,
            data: objFormData,
            //JQUERY CONVERT THE FILES ARRAYS INTO STRINGS.SO processData:false
            processData: false,
            success: function (data)
            {

            }
        });
    }
</script>

<form id="myForm9" method="post" enctype="multipart/form-data">
    <input class="form-control" type="file" name="fileToUpload1" id="fileToUpload1" >
    <input class="form-control" type="file" name="fileToUpload2" id="fileToUpload2" >
    <input id="resumeid9" name="resumeid9" type="hidden" value="<? echo $resumeid;?>"/>
    <input type="button" class="btn btn-rounded btn-primary btn-sm" id="submitFormData9" onclick="SubmitFormData9();" value="Submit" />
</form>

PHP 代码应如下所示。

<?php

function uploadFiles($strTargetDir = "", $strFileInputName = "")
{

    $target_file   = $strTargetDir . basename($_FILES[$strFileInputName]["name"]);
    $uploadOk      = 1;
    $imageFileType = pathinfo($target_file, PATHINFO_EXTENSION);
    $new_filename1 = $strTargetDir . uniqid() . '.' . $imageFileType;
    if (move_uploaded_file($_FILES[$strFileInputName]["tmp_name"], $new_filename1))
    {
        $filee1 = $new_filename1;
    }
}

if (!empty($_FILES['fileToUpload1']))
{
    uploadFiles("reqdoc/", "fileToUpload1");
}
if (!empty($_FILES['fileToUpload2']))
{
    uploadFiles("reqdoc2/", "fileToUpload2");
}
?>