FromData---ajax提交数据

通常想要不刷新页面提交数据时,能够使用ajax提交。若是数据量不大能够本身写json数据用ajax提交到后台服务,可是数据量多且须要动态添加数据时,本身写json格式数据就有点麻烦了,这时候就须要FormData来替咱们完成数据的装载了。vue

Html上传视频文件(vue)ajax

<input type="file" class="upload uploadfile" v-on:change="fileChange" accept="video/*" name="upload" >

一、FormData动态添加数据json

var fileObj = $(this.$el).find(".uploadfile")[0].files[0]; // js 获取文件对象
var formData = new FormData(); // FormData 对象
formData.append("file", fileObj); // 文件对象
//append()以键值对的形式往FormData塞数据

二、使用FormData和ajax配合提交表单能够实现不刷新页面,而且能够等待服务器返回结果作一些响应服务器

fileChange(e) {
	if (e.target.value) {
		var url = "http://vip.crmclick.com/API/FileData.ashx?action=video"; // 接收上传文件的后台地址
		 $.ajax({
			url: url,
			type: "POST",
			cache: false,
			data: formData,
			processData: false,// 默认值: true 若是要发送 DOM 树信息或其它不但愿转换的信息,请设置为 false
			contentType: false,// 告诉jQuery不要去设置Content-Type请求头
			success:(res)=> {
				this.src = res.url;
				this.$emit("save", this.src);
			},
			error:(data)=> {
	        }
	    });
	 }
}
相关文章
相关标签/搜索