web前端图片上传(2)

　　今天发现了一种ajax上传图片的方式，是之前没有用过的，首先来讲下为何要用这种方式。是由于原来后台是用的form表单的方式来提交表单数据的。可是以为呢，这种方式不太好，由于要刷新页面，前台只用控制台看不到传输的参数（若是哪位大神知道怎么看到，请不吝赐教），因此咱们就改为了ajax的方式，结果后台老哥说，前端改改就好了，后端不用改。而后我去找到了这种ajax提交表单的方式。废话很少说，直接看代码。

 1 var formData = new FormData();//首先这里新建一个空对象  2                     formData.append("file", document.getElementById("file").files[0]);//这里是一个图片的input框，id为file。appen的第一个参数，是后台的传输的字段  3                     formData.append("reward_name", reward_name);  4                     formData.append("reward_id", reward_id);  5                     formData.append("reward_num", reward_num);  6                     formData.append("exchange_num", exchange_num);  7  $.ajax({  8                         url:"__ROOT__/index.php/Administration/Gamemanage/add_icon",  9                         type:"post", 10                         processData:false, //这里须要注意，必定要写false，由于有图片，因此不须要序列化 11                         contentType:false, //这里也是一个须要注意的点。也要写false 12  data:formData, 13                         dataType:'json', 14                         success:function(data){ 15                             if(data.info=="添加成功"){ 16  alert(data.info); 17  window.reload(); 18                             }else{ 19  alert(data.info); 20  } 21  } 22                     });

　　这种方法和我上次写的那个是不同的，此次的方法是直接提交一个文件。咱们来看下这种方式的请求头，和通常的ajax是不同的。请看截图

 

里面的参数就是我上面代码中写的参数，你们能够一一对应起来。

　　附上上一篇的连接。这是另外一种ajax传输base64图片的方式。其实两种方式都是能够的，可是须要看后台怎么选择。毕竟先后台须要合做，哪一种方式只须要先后台商量好就行。