jquery - 如何在 laravel 中使用 ajax 上传文件？

Question

我想将用户的个人资料图片上传到服务器，但我被困在图片的 ajax 上传中。

我所有的表单数据都没有发布到数据库，包括图像名称，并且文件没有上传到服务器。

<script>
    $(document).ready(function()  {
        $('#sacrificeForm').submit(function(event){
            event.preventDefault();
            $.ajax({
                url:'{{ route('sacrifice.store') }}',
                method:"POST",
                data : $('#sacrificeForm').serialize(),
                success:function(data){
                    const variables = ['sacrifice', 'fileSacrifice'];
                    variables.forEach(variable => {
                        if(data[variable] === null) data[variable] = '';
                    });
                    let html = '' +
                        '<tr>'+
                        '<td class="fw-normal">'+data.id+'</td>'+
                        '<td class="fw-normal">'+data.sacrifice+'</td>'+
                        '<td>'+
                        '<form method="post" id="sacrifice-destroy">'+
                        '@csrf'+
                        '@method('DELETE')'+
                        '<div class="btn-group">'+
                        '<a data-id="'+data.id+'" class="btn btn-info btn-sm" id="sacrificeEdit" data-bs-toggle="modal" data-bs-target="#sacrificeModal">ویرایش</a>'+
                        '<button data-id="'+data.id+'" type="button" class="btn btn-danger btn-sm" id="sacrificeDestroy">حذف</button>'+
                        '</div>'+
                        '</form>'+
                        '</td>'+
                        '</tr>';
                    $('#sacrificesTable').append(html);
                },
            });
        });
    });
</script>

标签： jqueryajaxfile-upload