您的位置:首页 > 编程语言

测试代码,包含用户登陆,文件上传

2016-09-20 10:33 225 查看
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="js/jquery-2.2.4.js"></script>
<script type="text/javascript" src="js/jquery-form.js"></script>
<script type="text/javascript">
function checkLogin() {
var username = $("#username").val();
var password = $("#password").val();
if (username == null || username == "") {
alert("username is empty!")
return false;
}
if (password == null || password == "") {
alert("password is empty!")
return false;
}
$.ajax({
url : 'login/manager.do',
type : 'POST',
data : {
username : username,
password : password
},
dataType : 'json',
success : function(data) {
if (data.status == 0) {
alert(data.message);
} else {
window.location.href = 'mgr/admin.do';
}
},
error : function() {
alert("error")
}
});
}

function upload() {
var imagePath = $("#image_input").val();
if (imagePath == "") {
alert("please upload image file");
return false;
}
var strExtension = imagePath.substr(imagePath.lastIndexOf('.') + 1);
if (strExtension != 'jpg' && strExtension != 'gif'
&& strExtension != 'png' && strExtension != 'bmp') {
alert("please upload file that is a image");
return false;
}
$("#form").ajaxSubmit({
type : 'POST',
url : 'upload/image.do',
success : function(data) {
alert("success");
$("#imgDiv").empty();
$("#imgDiv").html('<img src="'+data+'"/>');
$("#imgDiv").show();
},
error : function() {
alert("error");
}
});

}

function addNewProduct() {
var name = $('#name').val();
var detail = $('#detail').val();
var price = $('#price').val();
var type = $('#type').val();
var photo = $('#photo').val();
}
</script>
</head>
<body>
<h2>Hello World!</h2>
username:
<input type="text" id="username" />
<br />password:
<input type="text" id="password" />
<a href="#" onclick="checkLogin()">Login</a>

<hr />
<form id="form" enctype="multipart/form-data">
upload image:
<input type="file" id="image_input" name="file" />
<a href="#" onclick="upload()">upload</a>
</form>
<div id="imgDiv"></div>

<hr />
product info input:
<br />
<br /> name:
<input type="text" id="name" />
<br /> detail:
<input type="text" id="detail" />
<br /> price:
<input type="text" id="price" />
<br /> type:
<input type="text" id="type" />
<br /> photo:
<input type="text" id="type" />
<br />
<a href="#" onclick="addNewProduct()">add</a>

</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐