Php 上载文件并重新加载div，而不是重新加载页面

我的问题与上载文件后重新加载PHP页面的错误有关

现在我只需要重新加载一个div而不是整个页面，JQuery不是我最好的朋友

我使用以下JQuery函数（我从中获得JQuery代码）将表单放入一个div中，如下所示：

上载文件：
$（'#uploadFile'）.submit（函数（）
{
event.preventDefault（）；
$.ajax(
{
url:“upload.php”，
键入：“POST”，
数据：$（this）.serialize（），
成功：功能（数据）
{
$（“#updiv”）.fadeOut（）；
设置超时（1000）；
$（“#updiv”）.fadeIn（）；
});
});
$（此）.ajaxSubmit（选项）；
返回false；
});

这是upload.php文件：

<?php
/* upload.php */
set_time_limit(0);

$targetDir = "/path/to/upload/dir";
$targetFile = $targetDir . basename($_FILES["fileToUpload"]["name"]);
$upload = 1;
$fileType = pathinfo($targetFile, PATHINFO_EXTENSION);

if(isset($_POST["submit"]))
{
    /* Check file size */
    if($_FILES["fileToUpload"]["size"] > 500000)
    {
        echo "Sorry, your file is too large.";
        $upload = 0;
    }
    /* Allow certain file formats */
    if($fileType != "data" )
    {
        echo "Sorry, non valid filetype.";
        $upload = 0;   
    }
    /* Check if $uploadOk is set to 0 by an error */
    if($upload == 0)
    {
        echo "Sorry, your file was not uploaded.";
    } 
    else
    {
        if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $targetFile))
        {
            echo "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been uploaded.";
        }
        else
        {
            echo "Sorry, there was an error uploading your file.";
        }
    }
}

---

在多部分表单上使用jQuery

.serialize（）

将不会发送文件数据

有关更多详细信息，请参见，但基本上您可以这样做

data: new FormData($(this)[0])

而不是

data: $(this).serialize()

附加

processData: false

到

$.ajax

对象参数表

关于测试问题，如果您提交表单时未涉及jQuery，您是否检查了表单提交和文件上载是否正确？

我建议您使用

有一个演示php项目，您可以从中获得想法，并学习如何实现它
关于重新加载一个div部件，我不知道这是什么意思，你能解释一下吗

更新：

upload.php

文件的输出可以加载到

updiv

中。例如，如果您执行

die（'blabla'）

在

upload.php

中，您可以将其用作

updiv

内部html。如果您使用我上面提到的jQuery插件，它将是这样的：

<script>
$(function () {
    $('#fileupload').fileupload({
        dataType: 'html', // this could be json too, depends on your needs
        done: function (e, data) { // data.result is whatever returned from your upload.php
            $.each(data.result.files, function (index, file) {
                $('#updiv').html(data.result);
            });
        }
    });
});
</script>

$（函数（）{
$（'#fileupload'）。fileupload({
数据类型：'html'，//也可以是json，这取决于您的需要
完成：函数（e，data）{//data.result是从upload.php返回的结果
$.each（data.result.files，函数（索引，文件）{
$（'#updiv'）.html（data.result）；
});
}
});
});

这是一个工作示例，您必须使用

formData

才能通过ajax发送文件，这将重新加载div并在

中返回服务器响应

上载文件：
上载文件：
$（'#uploadFile'）.submit（函数（）
{
event.preventDefault（）；
$（“#updiv”）.fadeOut（）；
$.ajax(
{ 
url:“upload.php”，
键入：“POST”，
数据：新表单数据（本），
contentType:false，
processData:false，
成功：功能（数据）
{
$（'.info'）.html（数据）；
$（'.info'）.show（）；
$（“#updiv”）.fadeIn（）；
}
});
});

当然，为什么在每个if语句中都包含

“fileform.php”

？有什么原因吗？哎哟！这是一个错误。。我纠正了。很抱歉我从链接的线程复制了upload.php的内容。但是网站上运行的原始文件没有这些说明。。再次抱歉，我更正了它们。好的，如果您将

include（“fileform.php”）；

放在顶部会怎么样？我以前尝试过不使用JQuery，我可以上载该文件。我做了您建议的更改，但仍然出现相同的错误：（我不想重新加载整个页面。我只想更新包含表单的div updiv的内容。我正在查看您的链接。提前感谢您。我希望它会有所帮助。我将在接下来的几分钟内尝试它！现在非常感谢！我已经尝试过了，而且效果很好！谢谢！我非常沮丧！谢谢！

processData: false

<script>
$(function () {
    $('#fileupload').fileupload({
        dataType: 'html', // this could be json too, depends on your needs
        done: function (e, data) { // data.result is whatever returned from your upload.php
            $.each(data.result.files, function (index, file) {
                $('#updiv').html(data.result);
            });
        }
    });
});
</script>

  <form id="uploadFile" enctype="multipart/form-data">
    <h3>Upload a file:</h3>
    <input type="file" name="fileToUpload" id="fileToUpload">
    <input type="submit" id="submit" value="Upload" name="submit">
  </form>
  <!-- Response Output -->
  <div class="info" style="display:none"></div>
</div>

<div id="updiv">
<form id="uploadFile" enctype="multipart/form-data">
<h3>Upload a file:</h3>
<input type="file" name="fileToUpload" id="fileToUpload">
<input type="submit" id="submit" value="Upload" name="submit">
</form>

<!-- Response Output -->
<div class="info" style="display:none"></div>

</div>

<script>
$('#uploadFile').submit(function()
{
  event.preventDefault();
  $("#updiv").fadeOut();
  $.ajax(
  { 
    url: "upload.php",
    type: 'POST',
    data: new FormData(this),
    contentType: false,
    processData: false,
    success: function(data)
    {
      $('.info').html(data);    
      $('.info').show();    
      $("#updiv").fadeIn();
    }
  });

});
</script>