jsp如何显示本地图片？

你这个本地是服务器还是？img 标签呗

<img src="">src地址要怎么写？最近在做一个图片上传，上传前有个图片预览功能。问题：上传的本地地址容易求，但是怎么让jsp页面能够显示本地图片呢？
ps:预览一定要在上传之前完成。

<img src="">
最好用绝对路径

具体怎么做呢？比如我要显示本地 E：/001.jpg这张图片，注意是JSP、本地图片、上传之前预览

在jsp里面写点java代码，用流把图片读入，然后写出，图片不在项目下面，用<img src=""> 应该不行吧

ls的意思应该是先把图片上传到tomcat对应的路径里，然后就可以读到图片了，但是现在是要在上传操作前要显示图片，这时图片还在本地这个问题纠结了一天，网上的方法不是没用就是浏览器不兼容。。继续纠结中

用javascript改变<img src="">里的src路径不就可以了！
当点击预览时，选择好图片，再将图片的绝对路径，设置到<img src="">里面。
当浏览下张图片时，绝对路径变了，图片不就变了！

<img src="">始终指向的都是服务器上的路径，
你可以使用流的方式把图片先读到内存里，然后在把内存里的信息转换成image对象，在页面输出。
或者你在项目中使用一个临时文件夹也可以，先把图片从你本地拷贝到项目的临时文件夹中，然后从临时文件中读取图片。

http://www.cnblogs.com/cloudgamer/archive/2009/12/22/ImagePreview.html给你找了个例子，在最下边的地方有JSP源码下载。你好好看看，理解理解

绝对路径是王道，什么图片都能显示，不信你自己弄个HTML的来看看。

地址获取简单，不过这图片地址获取到的是本地的，你怎么让它显示在JSP页面中呢？
不过还是要感谢下这么多朋友来帮我想办法。

你在将jsp中用 <img src=image/<jsp:getProperty name="upFile" property="savedFileName"/>来获取图片<jsp:getProperty name="upFile" property="savedFileName"/>的意思是得到图片地址
我用 javabean+jsp做的

我原来公司的项目就是参考这个网址做的，并且使用了fck编辑器，很好用，楼主不妨参考下。

<img src="">
最好用相对路径

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%
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>上传图片</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="<%=basePath%>css/validate.css">
<script type="text/javascript"
src="<%=basePath%>/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript"
src="<%=basePath%>/js/easy_validator.pack.js"></script> <style type="text/css">
.img {
width: 136px;
height: 102px;
}.imgError {
border: 3px solid red;
}
</style>
<script type="text/javascript">
         //限制上传图片大小1000K
        var MAXSIZE = 1000 * 1024;

        //图片大小限制信息
        var ERROR_IMGSIZE = "图片大小不能超过1000K";
        //默认图片
        var NOPHOTO = "<%=basePath%>image/bg2.jpg";

        //图片是否合格
        var isImg = true;
        /**
         * Input file onchange事件
         * @params obj file对象
         * @return void
         **/
        function checkFileChange(obj) {

            //初始化设置
            $(".imgTable").removeClass("imgError");
            updateTips("");
            var img = $(".img").get(0);
            var file = obj.value;
            var exp = /.\.jpg|.\.gif|.\.png|.\.bmp/i;
            if (exp.test(file)) {//验证格式
                if($.browser.msie) {//判断是否是IE
                    img.src = file;
                } else {
                    img.src = obj.files[0].getAsDataURL();
                    sizeCheck(img);
                }

            } else {
                img.src = NOPHOTO;
                $(".imgTable").addClass("imgError");
                updateTips("图片格式不正确");
                isImg = false;
            }

        }
        /**
         * sizeCheck 检查图片大小
         * @params img 图片对象
         * @return void
         **/
        function sizeCheck(img) {
            //初始化设置
            $(".imgTable").removeClass("imgError");
            updateTips("");
            if ($.browser.msie) {//查看是否是IE
                if(img.readyState == "complete") {
                   if (img.fileSize > MAXSIZE) {
                        $(".imgTable").addClass("imgError");
                        updateTips(ERROR_IMGSIZE);
                        isImg =  false;
                   }else {
                        isImg = true;
                   }

                }else {
                    $(".imgTable").addClass("imgError");
                    updateTips(ERROR_IMGSIZE);
                    isImg =  false;
                }

            } else {
                var file = $("input:file[name='image']")[0];

                if (file.files[0].fileSize > MAXSIZE) {
                    $(".imgTable").addClass("imgError");
                    updateTips(ERROR_IMGSIZE);
                    isImg =  false;
                }else {
                    isImg = true;
                }

            }
        }

        /**
         * updateTips 注册错误信息显示
         * @params str 显示内容
         * @return void
         **/
        function updateTips(str) {
            $("p#errorTips").text(str);
        }
        /**
         * commit 注册提交
         * @return void
         **/
        function commit() {

            var isCommit = true;
            var img     = $(".img"),
                file    = $("input:file[name='image']"),
                frm     = document.frm;
            isCommit = isCommit && isImg;
            if(isCommit) {
                frm.submit();
            }
        }
        /**
         * errorImg 图片错误显示
         * @params img 图片对象
         * @return void
         **/
        function errorImg(img) {
            img.src = NOPHOTO;
        }

      </script>
</script>
</head>
<body>
<form id="frm" name="frm" onSubmit="return commit();"
action="${public String _elExpressionpageContext.getRequest().getContextPath()}/upload/PicUpload"
enctype="multipart/form-data" method="post">
<p />
<table cellpadding="0" cellspacing="0" class="imgTable">
<tr>
<td>
<img src="<%=basePath%>image/bg2.jpg" class="img" alt="头像预览"
onerror="Javascript:errorImg(this);"
onreadystatechange="Javascript:sizeCheck(this);" />
</td>
</tr>
</table>
<input type="file" name="image"
onchange="Javascript:checkFileChange(this);" size="12"
class="input_validation-failed" reg=".*gif|jpg|bmp|png$"
tip="允许gif,jpg,bmp,png图片" />
<span id="files">
<p />
</span>
<img onClick="javascript:commit()" style="cursor: pointer"
src="<%=basePath%>/image/pic.jpg" />
<p />
<font color="red"><p id="errorTips"></p>
</font>
<s:property value="message" />
<p />
<font color="red">特别提醒：上传相同文件名的图片会覆盖上次上传的同名文件，且图片大小不能超过1000K，请慎重！</font>
</form>
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<script language="javascript">
function setImg(){
var v=form1.myfile.value;
//alert(v);
document.getElementById("myImg").innerHTML="<img src='"+v+"'>";
}
</script>
<body>
<form name="form1" method="post" action="">
<input name="myfile" type="file" onChange="setImg()">
<div id="myImg"></div>
</form>
</body>
</html> 这样就可以了。

这样是不行滴，jsp不可以显示非webapp下的本地图片。

预览直接获得用户选择的文件路径(包含文件名)放用js添加到img的src中就可以了。

LZ试试下面的代码，应该就可以了
<script type="text/javascript" src="js/jquery-1.5.js"></script>
<script type="text/javascript">
function post(){
var a =$('#a').val();
alert(a);
$('#img').attr("src",a);;
}
</script>
  </head>

  <body>
    <input type="file" id="a" onchange="post();">
    <img  id="img"/>
  </body>

http://download.csdn.net/source/3532658
应该对你有用

显示本地的图片，比如图片在你的工程里面，你的jsp页面可以
<img src="../image.gif" />

<img src="">指向图片的路径

调试易

jsp如何显示本地图片？

解决方案 »