ajax异步提交表单上传图片的一个小案例

最新推荐文章于 2021-08-06 13:03:43 发布

qq_34787830

最新推荐文章于 2021-08-06 13:03:43 发布

阅读量329

点赞数 1

分类专栏： ajax jquery 文章标签： ajax

本文链接：https://blog.csdn.net/qq_34787830/article/details/80158406

版权

jquery 同时被 2 个专栏收录

2 篇文章 0 订阅

订阅专栏

ajax

1 篇文章 0 订阅

订阅专栏

<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">

<script type="text/javascript" src="js/jquery-3.2.1.js"></script>
<script src="http://malsup.github.io/jquery.form.js"></script>

<script type="text/javascript">
function uploadPic() {
// 上传设置
var options = {
// 规定把请求发送到那个URL
url:'manage/file/upload.do',
// 请求方式
type: "post",
// 服务器响应的数据类型
dataType: "json",
// 请求成功时执行的回调函数
success: function() {
// 图片显示地址
/* $("#allUrl").attr("src", data.path); */
alert("asdsa")

}
};

$("#addProductForm").ajaxSubmit(options);
}
</script>

</head>

<body>
This is my JSP page. <br>
<form id="addProductForm" method="post" enctype="multipart/form-data">
<input name="file" type="file" οnchange="uploadPic()"/>
<button id="tijiao" >upload</button>
</form>
</body>
</html>