如何实现图片上传功能

实现图片上传功能

需求：选择图片头像，将所选头像图片展示在页面上并将地址保存在隐藏域中，再发送ajax创建

代码：

/ 当用户选择文件的时候
$('#avatar').on('change', function() {
	// 用户选择到的文件
	// this.files[0]
	var formData = new FormData();
	formData.append('avatar', this.files[0]);
	//发送ajax
	$.ajax({
		type: 'post',
		url: '/upload',
		data: formData,
		// 告诉$.ajax方法不要解析请求参数
		processData: false,
		// 告诉$.ajax方法不要设置请求参数的类型
		contentType: false,
		success: function (response) {
			//console.log(response)
			// 实现头像预览功能
			$('#preview').attr('src', response[0].avatar);
            //将图片的地址保存到隐藏域
			$('#hiddenAvatar').val(response[0].avatar)
		}
	})
});