ajax提交form表单文件怎么获取数据（ajax form表单提交）

最近在学习PHP时，遇到不知道如何含文件上传的form表单AJAX提交，现在把这些记录下来以备自己后续复习时用：

HTML代码

	<form method="POST" class="form form-horizontal" enctype="multipart/form-data" id='editinfo'>
				<input type="hidden" value="{$list.id}" name='id'>
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span class="c-red"></span></label>
					<div class="formControls col-xs-8 col-sm-9"><img src='{$list.faceimage}' width="120px"
							height="160px" id='faceimage'>
					</div>

				</div>
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>姓名：</label>
					<div class="formControls col-xs-8 col-sm-9">
						<input type="text" class="edit_input-text" value="{$list.name}" placeholder="" id="name"
							name="name" style="width:400px;height:25px">
					</div>
				</div>

				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>性别：</label>
					<div class="formControls col-xs-8 col-sm-9 skin-minimal">
						<select class="select" name="sex" size="1" style="width:400px;height:30px">
							{eq name='list.sex' value='男'}

							<option value="男" selected>男</option>
							<option value="女">女</option>
							{else /}
							<option value="男">男</option>
							<option value="女" selected>女</option>
							{/eq}
						</select>
					</div>
				</div>
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span class="c-red"></span>所教班级</label>
					<div class="formControls col-xs-8 col-sm-9">
						{volist name='classlist' id='vo'}
						{in name='$vo.name' value='$list.class'}
						<input type="checkbox" value="{$vo.name}" name='class[]' checked>{$vo.name}
						{else /}
						<input type="checkbox" value="{$vo.name}" name='class[]'>{$vo.name}
						{/in}
						{/volist}

					</div>
				</div>
				<div class="row cl">
					<label class="form-label col-xs-4 col-sm-3"><span class="c-red"></span>上传头像</label>
					<div class="formControls col-xs-8 col-sm-9">

						<input type="file" name='faceimage' accept="image/jpeg,image/png">

					</div>
				</div>
				<div class="row cl">
					<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
						<input class="btn btn-primary radius" type="button" value="  提交  "
							id='button'>
					</div>
				</div>
			</form>

script部分

<script>
		$(function () {
			$('#button').on('click', function () {
				var data=new FormData(document.getElementById("editinfo"));

				$.ajax({
					type: "POST",  //提交的类型是POST
					url: "{:url('editUserOperation')}",
					data: data,   //FormData序列化不能用serialize()序列化，不然不能传递file,
					dataType: "json",  //数字类型JSON
					processData:false,
					contentType:false,
					success: function (data) {
						alert(data.message);
					}
				});
			})
		})

	</script>

后台处理部分：

public function editUserOperation(Request $request)
    {
        $this->isTeacherLogin();
        $data = $request->param(true);
  
        foreach ($data as $key => $value) {
            if ($key == "faceimage") {     //判断file的input有没有选择文件
                $file = request()->file('faceimage');
                $info = $file->move("../uploads/");
                $url = $info->getSaveName();   //文件上传后的路径和文件名
                $data[$key] = $url;
            }else{
                $data[$key] = $value;
            }
        }
        $condition = ['id' => $data['id']];
        $result = TeacherModel::update($data, $condition);
        if ($result == true) {
            return ['message' => "修改成功"];
        } else {
            return ['message' => "修改失败"];
        }
   return ['message' => "成功"];
    }

这是我初学TP5.1学习资料，大神们勿喷！