Javascript 如何通过这个ajax脚本获取文件

我试图通过ajax向php脚本发送一个文件，但是我发现它没有被正确地传递，因为我试图回显该文件，但得到了

null

响应。我怎样才能解决这个问题

HTML JS代码

<script type="text/javascript">
$(function(){
    $("#first").submit(function(event){
        event.preventDefault();

        $(this).find(".error").remove();
        file = $(this).find("input[name=file_save]").val();
        form = $(this);
        url = $(this).attr("action");
        $.post(url,{file_save:file}, function(data){    
            console.log(data);
        },"json");
        return false;
    });
});

</script>

$（函数（）{
$（“#第一”）.submit（函数（事件）{
event.preventDefault（）；
$（this.find（“.error”）.remove（）；
file=$（this.find）（“input[name=file_save]”）.val（）；
表格=$（本）；
url=$（this.attr（“操作”）；
$.post（url，{file\u save:file}，函数（数据）{
控制台日志（数据）；
}“json”）；
返回false；
});
});

Php脚本（addImages.Php）

---

$tableau

未定义。
您的PHP srcipt应该如下所示：

<?php
$username = $_POST['files'];
$tableau = [];
$tableau["error"] = $username;
echo json_encode($tableau);

---

谢谢，伙计，但我对你所做的更改也有同样的问题requested@Bobby然后试着查看变量的大小。
<?php
$username = $_POST['files'];
$tableau = [];
$tableau["error"] = $username;
echo json_encode($tableau);