一定要记得设置跨域请求中的权限问题哦,不会的可以看另一篇文章:
文章:ajax跨域请求,jquery ajax跨域报500,解决ajax跨域的解决办法!
前端html(域1):
<input id="appImgs" name="image" type="file" accept="image/*"> <select name="catid"> <option value="1">生活照</option> <option value="2">游玩照</option> <option value="3">风景照</option> </select> <input type="text" name="des"> <button onclick="uploads();">确认上传</button>
AJAX部分(域1):
<script> function uploads(param){ var oFiles = document.querySelector("#appImgs").files; // 组装数据(文件数据,普通数据) var formData = new FormData(); formData.append('image', oFiles[0]); formData.append('des' , $("input[name='des']").val()); formData.append('catid', $("select[name='catid']").val()); $.ajax({ type: 'POST', url: '请求地址', data: formData, cache: false, contentType: false, processData: false, success: function(obj) { var data = eval("("+obj+")"); if(data.code==1){ alert('上传成功'); }else{ alert('上传失败'); } }, error:function(e){ alert('error'); } }); } </script>
PHP部分(域2):
// 普通数据接收 $data = [ 'des' => $_POST['des'], 'catid' => $_POST['catid'] ]; //图片接收上传 if(!empty($_FILES['image'])){ $img = config('image')['image'].get_uniqid(); $data['image'] = $img.'.'.pathinfo($_FILES['image']['name'])['extension']; if(!copy ( $_FILES['image']['tmp_name'] ,$data['image'] )) json(0, '图片上传失败'); }else{ json(0, '请选择图片上传'); } // 其他逻辑代码 json(1, '图片上传成功');
【注意:】
按照上面的是请求不了,上传不了图片的哦。还需要设置一下权限问题:
请看另一篇文章:ajax跨域请求,jquery ajax跨域报500,解决ajax跨域的解决办法!