当我点击上传按钮时，没有任何事情发生。
此页面包含另一页 所以我需要使用按钮点击，因为主页面已经有另一个表单和提交按钮。
我认为我的脚本代码失败了。 UploadImage.jsp 编辑=我添加了我的Servlet和jsp页面。 FirstOne UploadImage.jsp第二个是AddBand.jsp，lastone是servlet控制器。当我点击上传按钮时， isMultiPartContent方法返回false。
<form id="uploadForm" >
<div class="form-group">
<label for="bandPicture">GRUP RESMİ</label>
<input type="file" accept="image/x-png,image/gif,image/jpeg" id="bandPicture" class="form-control" name="bandPicture">
<input type="button" id="uploadImage" class="btn-success" value="Upload">
<label id="uploadResult"></label>
</div>
</form>
<script type="text/javascript">
$(document).ready(function(){
$('#uploadImage').click(function(){
var form = $('#uploadform');
form.submit();
form.submit(function(){
$.ajax({
type: 'Post',
url: 'UploadImage',
data: form.serialize(),
enctype: 'multipart/form-data',
success: function(result) {
$('#uploadResult').html(result);
}
});
});
});
});
</script>
<html>
<head>
<title>Manhattan Live Performance</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="assets/css/style.css" rel="stylesheet" type="text/css"
media="all" />
<link href="assets/3thParty/css/bootstrap.min.css" rel="stylesheet"
type="text/css" />
<link href="assets/3thParty/css/bootstrap-theme.min.css"
rel="stylesheet" type="text/css" />
<script src="assets/3thParty/js/jquery-3.2.1.min.js"
type="text/javascript"></script>
<script src="assets/3thParty/js/bootstrap.min.js" type="text/javascript"></script>
<style type="text/css">
label {color:white !important}
</style>
</head>
<body>
<div class="header">
<jsp:include page="AdminHeader.jsp" />
</div>
<div class="container">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<form action="AdminPanel/AddBand" method="Post" enctype="multipart/form-data">
<div class="form-group">
<label for="bandName">GRUP ADI</label>
<input type="text" id="bandName" class="form-control" name="bandName">
</div>
<div class="form-group">
<div class="row">
<div class="col-md-4">
<label for="member">GRUP ÜYESİ</label>
<input type="text" id="member" class="form-control" name="member">
<input type="button" class="btn btn-success" style="float: right;" onClick="addMember();" value="Ekle">
</div>
<div class="col-md-8">
<label for="bandName">EKLENEN ÜYELER</label>
<select class="form-control" name="memberList" id="memberList"></select>
<input type="button" class="btn btn-success" style="float: right;" onClick="deleteMember();" value="Çıkar">
</div>
</div>
</div>
<div>
<jsp:include page="UploadImage.jsp"></jsp:include>
</div>
<div class="form-group">
<label >
<input type="checkbox">Haftalık Grup
</label>
</div>
<div class="form-group">
<label for="bandInfo">GRUP HAKKINDA</label></br>
<textarea class="form-control" id="editor" rows="6" name="bandInfo"></textarea>
</div>
<div class="form-group">
<input type="submit" id="submit" class="btn-success" value="GRUBU EKLE">
</div>
</form>
</div>
</div>
</div>
<div class="footer">
<jsp:include page="../Footer.jsp"></jsp:include>
</div>
<script type="text/javascript">
function addMember() {
var opt = document.createElement("option");
opt.text = document.getElementById("member").value;
opt.value = document.getElementById("member").value;
var select = document.getElementById("memberList");
select.appendChild(opt);
}
function deleteMember() {
var select = document.getElementById("memberList");
select.remove(select.selectedIndex);
}
</script>
</body>
</html>
public class UploadImageController extends HttpServlet {
/**
*
*/
private static final long serialVersionUID = 6737157694478413704L;
// Yüklenecek dizin
private static final String UPLOAD_DIRECTORY = "assets/images/upload";
// Upload ayarları
private static final int MEMORY_THRESHOLD = 1024 * 1024 * 3; // 3MB
private static final int MAX_FILE_SIZE = 1024 * 1024 * 40; // 40MB
private static final int MAX_REQUEST_SIZE = 1024 * 1024 * 50; // 50MB
private static final String UPLOAD_SUCCESS = "Dosya Yüklendi";
private static final String NO_FILE = "Lütfen Resim Seçin";
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
resp.setContentType("text/plain");
resp.setCharacterEncoding("UTF-8");
PrintWriter out = resp.getWriter();
if(!ServletFileUpload.isMultipartContent(req)) {
out.print("enctype = multipart/form-data olmalıdır.");
out.flush();
return;
}
DiskFileItemFactory factory = new DiskFileItemFactory();
factory.setSizeThreshold(MEMORY_THRESHOLD);
File repository = new File(System.getProperty("java.io.tmpdir"));
System.out.println(repository.getAbsolutePath());
factory.setRepository(repository);
ServletFileUpload upload = new ServletFileUpload(factory);
upload.setFileSizeMax(MAX_FILE_SIZE);
upload.setSizeMax(MAX_REQUEST_SIZE);
String uploadPath = getServletContext().getRealPath("")
+ File.separator + UPLOAD_DIRECTORY;
System.out.println(uploadPath);
try {
List<FileItem> images = upload.parseRequest(req);
if (images != null && images.size() > 0) {
for (FileItem image : images) {
if (!image.isFormField()) {
String fileName = new File(image.getName()).getName() + System.currentTimeMillis();
String filePath = uploadPath + File.separator + fileName;
File storeFile = new File(filePath);
//Dosyayı Kaydet
image.write(storeFile);
out.print(UPLOAD_SUCCESS);
}
else out.print("Form elemanı değil");
}
} else out.print(NO_FILE);
} catch (Exception e) {
out.print("Exeption");
e.printStackTrace();
}
}
}
答案 0 :(得分：0)
您不需要提交功能
$(document).ready(function(){
$('#uploadImage').click(function(){
var form = $('#uploadform');
$.ajax({
type: 'Post',
url: 'UploadImage',
data: form.serialize(),
enctype: 'multipart/form-data',
success: function(result) {
$('#uploadResult').html(result);
}
});
});
});