PHP Ajax文件上传不起作用[重复]

Posted 2023-02-22

【中文标题】PHP Ajax文件上传不起作用[重复]

【英文标题】：PHP Ajax File Upload is not working [duplicate]

【发布时间】：2018-03-20 18:55:15

【问题描述】：

我使用 Bootstrap 并在 Modalbox 中有一个表单。

还有一个文件上传，我想上传图片，但如果我点击提交按钮，网站看起来像是即时重新加载并且没有文件上传...

这是我的 Ajax 脚本

<script type="text/javascript">
    $("#submitad").click(function () 
        $.ajax(
            url: "application/views/addad.php",
            type: "POST",
            data: $("#addad").serialize(),
            success: function (data)
            
                alert(data);
            
        );
    );
</script>

这是上传的html表单字段

这里是 PHP 的东西

<?php
$target_dir = "uploads/";
$filename = basename($_FILES["InputFile"]["name"]);
$target_file = $target_dir . $filename;
$imageFileType = pathinfo($target_file, PATHINFO_EXTENSION);
$check = getimagesize($_FILES["InputFile"]["tmp_name"]);
if ($check !== false) 
    echo "File is an image - " . $check["mime"] . ".";
 else 
    echo "File is not an image.";

?>

但它不起作用......

如果我把它踢出 php 文件，它会用 type="text" 和数字保存我的其他字段

但是文件上传不起作用，我已经尝试了很多我在谷歌上找到的

【问题讨论】：

$filename = basename($_FILES["InputFile"]["name"]; - 缺少右括号？ $target_file = $target_dir . $filename); - 缺少左括号？

打开error reporting，你会发现你的问题（是的，复数）

@WilliamIsted 谢谢！那是一个错误！ :) 但是上传不起作用......它从引导程序中立即关闭了模态框，看起来像重新加载并且不上传文件

【参考方案1】：

尝试下面的代码并在 ajax 代码中做一些更改。在代码中添加以下参数。

处理数据：假， 内容类型：假，

并在 ajax 开始之前添加 var formData = new FormData($("#formID")[0]); 行。

或检查下面的代码并根据您的代码进行更改。

<script type="text/javascript">
    $("#submitad").click(function () 
        var formData = new FormData($("#addad")[0]);
        $.ajax(
            url: "application/views/addad.php",
            type: "POST",
            data: formData,
            processData: false,
            contentType: false,
            success: function (data)
            
                alert(data);
            
        );
    );
</script>

【讨论】：

谢谢...我试过了，但看起来不行。当我点击 modalbox (bootstrap) 上的提交时，它会立即关闭它，看起来没有上传...

【参考方案2】：

要使用 ajax 上传文件，您必须使用 FormData() 而不是 serialize。所以试试吧：

var file_data = $('#InputFile').prop('files')[0];
var form_data = new FormData();
form_data.append('file', file_data);  // you can append as many values here as you want

$.ajax(
        url         : 'addad.php',
        dataType    : 'text',
        cache       : false,
        contentType : false,
        processData : false,
        data        : form_data,                         
        type        : 'post',
        success     : function(output)
            alert(output);
        
);

Working Example

【讨论】：

我试过了......但没有用......当我点击表单上的提交时，他立即关闭了模式框，看起来像是重新加载网站并且没有上传

在表单中使用button，而不是输入submit

试过了...<button type="button" id="submitad" class="btn btn-primary">add</button> 但也不起作用...点击后重新加载它看起来一样