1.ajax上传图片
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>
</head>
<body>
<div id="uploadForm">
<input id="file" type="file" name="userfile"/>
<button id="upload" type="button">upload</button>
</div>
</body>
</html>
<script type="text/javascript" >
$(function () {
$("#upload").click(function () {
var formData = new FormData();
formData.append('file', $('#file')[0].files[0]);
$.ajax({
url: 'http://xxx/uploadFile',
type: 'POST',
cache: false,
data: formData,
processData: false,
contentType: false
}).done(function(res) {
}).fail(function(res) {});
});
});
</script>2.ajax跨域
在服务器接收时，只需在response添加响应头Header("Access-Control-Allow-Origin", "*")即可
如：
java:
@RequestMapping(value = "/uploadFile")
@ResponseBody
public String saveApplication(HttpServletRequest request, HttpServletResponse response) {
response.setHeader("Access-Control-Allow-Origin", "*");
String result = "success";
FileUpload fileUpload = new FileUpload();
UserFile userFile = fileUpload.fileUpload("file", request, response);
System.out.println(userFile);
return result;
}ajax跨域解决，方式2，jsonp方式
前台：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://bjzx.xdf.cn:80/scholarship/js/js/jquery-1.10.2.min.js"></script>
</head>
<body>
</body>
<script>
$(function() {
$.ajax({
type : 'get',
async: false,
url : 'http://bjmx.xdf.cn/huodong/middleSchoolActivity',
dataType : 'jsonp',
jsonp: 'jsonpCallback',
jsonpCallback:'jsonpCallback',//让后台jsonpCallback参数固定为所填的值，否则是随字字符串
success : function(result){
console.log(result.result);
console.log(result.data);
},
complete: function(XMLHttpRequest, textStatus){
},
error : function(json,XMLResponse){
result = "返回信息：" + json + "错误码：" + XMLHttpRequest.status;
console.log("错误信息：" + result);
}
});
});
</script>
</html>后台，java springmvc
@RequestMapping(value = "/xxx")
@ResponseBody
public String xxx (String jsonpCallback) {
Map<String, Object> dataMap = new HashMap<String, Object>();
String result = "success";
try {
List<Map<String, Object>> activityList = new ArrayList<Map<String,Object>>();
//TODO
dataMap.put("data", activityList);
}
catch (NumberFormatException e) {
e.printStackTrace();
result = "error";
}
dataMap.put("result", result);
String resultStr = com.alibaba.fastjson.JSONObject.toJSONString(dataMap);
return jsonpCallback + "(" + resultStr + ")";
}