在jsp中做照片上传预览的代码
2个回答
展开全部
建议你使用 Web upload 组件,可图片预览, 可多选,可拖放上传,可粘贴后直接上传
百度开源产品.
俩三行代码就可以直接使用
具体网址 :
http://www.admin10000.com/document/4721.html
百度开源产品.
俩三行代码就可以直接使用
具体网址 :
http://www.admin10000.com/document/4721.html
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
给你一份参考代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
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%>">
<title>Add product</title>
<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">
<link rel="stylesheet" type="text/css"
href="/shop/css/add_product.css">
<script language="javascript">
function checkPic() {
var picPath = document.getElementById("picPath").value;
var type = picPath.substring(picPath.lastIndexOf(".") + 1, picPath.length)
.toLowerCase();
if (type != "jpg" && type != "bmp" && type != "gif" && type != "png") {
alert("***请上传正确的图片格式");
return false;
}
return true;
}
//图片预览
function PreviewImage(divImage, upload, width, height) {
if (checkPic()) {
var imgPath;
//图片路径
var Browser_Agent = navigator.userAgent;
//判断浏览器的类型
if (Browser_Agent.indexOf("Firefox") != -1) {
//火狐浏览器
imgPath = upload.files[0].getAsDataURL();
document.getElementById(divImage).innerHTML = "<img id='imgPreview' src='"
+ imgPath
+ "' width='"
+ width
+ "' height='"
+ height
+ "'/>";
} else {
//IE浏览器
var Preview = document.getElementById(divImage);
Preview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = upload.value;
}
}
}
</script>
</head>
<body>
<form name="forms" action="/Add_ProductServlet" method="get">
<div id="container">
<div id="header">
<strong id="add">添加商品</strong>
</div>
<div id="pagebody">
<div id="pagebody_top">
商店名称：
<input type="text" name="shop_name" />
</div>
<div id="pagebody_middle">
<div id="middle_left">
<div id="Preview" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod = scale); width: 250px; line-height: 270px;" />
</div>
<div id="upload">
<input type="file" id="picPath" name="doc" onChange="PreviewImage('Preview',this,250,100);" />
</div>
</div>
<div id="middle_right">
<p id="type">
商品类型：
<select name="product_type" id="product_type">
<option value="1">
食品类
</option>
<option value="2">
电器类
</option>
<option value="3">
男装类
</option>
<option value="4">
女装类
</option>
<option value="5">
背包类
</option>
</select>
</p>
<p id="product_name">
商品名称：
<input type="text" name="product_name" />
</p>
<p id="product_price">
商品价格：
<input type="text" name="product_price" />
￥
</p>
<p id="product_remainder">
商品剩余数量：
<input type="text" name="product_remainder" />
</p>
</div>
</div>
<div id="pagebody_bottom">
<div id="bottom_left">
商品描述：
</div>
<div id="bottom_right">
<textarea rows="15" cols="78"></textarea>
</div>
<div id="tijiao">
<input type="reset" value="重置">
<input type="submit" value="提交" />
</div>
</div>
</div>
<div id="footer">
</div>
</div>
</form>
</body>
</html>
追问
这段代码无法预览上传的图片，我的想法是即上传到数据库，又可以在页面显示，
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
