这里我写的有点重复了 不太简洁 整体可以再优化
formData 是DOM对象 不是jquery对象
var formData = new FormData($("#file")[0]); 对象.append() 可以追加表单内所有信息上传服务器
Jquery的对象是 不能处理file
serialize() 序列化表单,用于 Ajax 请求,直接获取表单内数据传送服务器 ,$("form").serialize()
1 $("#file").change(function(e){ 2 var animateimg = $(this).val(); //获取上传的图片名 带// 3 var imgarr=animateimg.split('\'); //分割以逗号 结果 (C:fakepath6.jpg) 4 var myimg=imgarr[imgarr.length-1]; //去掉 // 获取图片名 6.jpg 5 var houzui = myimg.lastIndexOf('.'); //获取 . 出现的位置 1 6 7 8 var lastName = myimg.substring(houzui).toUpperCase(); // 也可以 (.JPG) 随便 不转也行,不转 下面也要用小写 9 10 var file = $('#file').get(0).files[0]; //获取上传的文件 11 var fileSize = file.size; //获取上传的文件大小 12 var maxSize = 1048576; //最大1MB 13 14 if(lastName !='.PNG'&& lastName !='.JPG' && lastName !='.JPEG'){ 15 parent.layer.msg('文件类型错误,请上传图片类型'); 16 return false; 17 }else if(parseInt(fileSize) >= parseInt(maxSize)){ 18 parent.layer.msg('上传的文件不能超过1MB'); // 需要layer的js 19 // layer.msg('<p style="color:black">文件上传仅支持 "jpg"和"png"格式</p>', {icon: 5,time: 2000}); 提示框+背景+表情 20 return false; 21 }else{ 22 var fileObj = $('#file').get(0).files[0]; 23 var formData = new FormData(); 24 // 存入文件对象 25 formData.append('file',fileObj); 26 formData.append('name',$("#name").val()); // 也可以用jquery 获取其他值 追加到后面 一起传过去. 27 console.log(fileObj); 28 29 $.ajax({ 30 url: "__URL__/setImg", 31 type: 'POST', 32 data: formData, 33 dataType: 'json', 34 async: false, 35 cache: false, 36 contentType: false, 37 processData: false, 38 success: function (response) { 39 if (response.status == 1) { 40 alert(response.msg); 41 window.location.href="<?php echo U('index');?>"; 42 }else if(response.status == 2){ 43 alert(response.msg); 44 }else { 45 alert(response.msg); 46 } 47 }, 48 }) 49 } 50 });
php
setImg方法返回格式:
echo json_encode(array('status'=>1,'msg'=>"上传成功",'pic'=>$newName));