在jsp中做照片上传预览的代码

 我来答
百度网友832bd6a
2014-08-04 · TA获得超过1180个赞
知道小有建树答主
回答量:422
采纳率:0%
帮助的人:405万
展开全部
建议你使用 Web upload 组件,可图片预览, 可多选,可拖放上传,可粘贴后直接上传

百度开源产品.

俩三行代码就可以直接使用

具体网址 :

http://www.admin10000.com/document/4721.html
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友cbad167
推荐于2016-10-27 · TA获得超过309个赞
知道小有建树答主
回答量:388
采纳率:66%
帮助的人:295万
展开全部

给你一份参考代码:

<%@ 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>
追问
这段代码无法预览上传的图片,我的想法是即上传到数据库,又可以在页面显示,
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式