<%@ page contentType="text/html;charset=UTF-8"%>
<html>
<head>
<title>图片上传预览</title>
<script>
function PreviewImage(imgFile)
{
var pattern = /(\.*.jpg$)|(\.*.png$)|(\.*.jpeg$)|(\.*.gif$)|(\.*.bmp$)/;
if(!pattern.test(imgFile.value))
{
alert("系统仅支持jpg/jpeg/png/gif/bmp格式的照片！");
imgFile.focus();
}
else
{
var path;
if(document.all)//IE
{
imgFile.select();
path = document.selection.createRange().text;
document.getElementById("imgPreview").innerHTML="";
document.getElementById("imgPreview").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='scale',src=\"" + path + "\")";//使用滤镜效果
}
else//FF
{
path = URL.createObjectURL(imgFile.files[0]);
document.getElementById("imgPreview").innerHTML = "<img src='"+path+"'/>";
}
}
}
</script>
</head>
<body>
<center>
<input type="file" onchange='PreviewImage(this)' />
<div id="imgPreview" style='width:500px; height:400px;'>
<img src=""/>
</div>
</center>
</body>
</html>
分享到：
相关推荐
此工程下页面test.jsp为图片选中预览功能实现
实现jsp的本地图片上传及预览，有详细的实现代码。
图片上传预览是一种在图片上传之前对图片进行本地预览的技术。 使用户选择图片后能立即查看图片，而不需上传服务器，提高用户体验。 但随着浏览器安全性的提高，要实现图片上传预览也越来越困难。 不过群众的智慧是...
Jquery 表单验证+本地图片上传-切割-预览 完全项目 希望不要用于商业用途
在网上找到一个高手写本地图片上传预览的插件，测试通过ie6，ff2.0、3.6，做成个Demo拿来和大家分享，jsp实现
jdk1.7, 纯java方式，借助layer/layui插件，实现多图片上传、删除、预览；实现post提交到服务端；可以直接根目录访问 whb.jsp
jsp中点击图片弹出文件上传界面及实现预览实例详解 花了两天时间琢磨一下图片预览的功能 任务需求如下： 1：jsp页面中有一个图片(pic_1) 2：点击图片弹出类似于资源管理器的界面 3：选择完某一个图片之后在pic_1处...
包括了ASP/ASP.NET/JSP/PHP四个版本的头像上传和裁切实例，上传图片成功后，会自动生成三种大小的图片供预览，可旋转头像图片，用户操作了裁切功能后，同样可适时预览三个大小的头像效果。 本地头像上传支持的...
新浪htmlteditor在线编辑器完美JSP版 支持全中文名称，由smartupload组件上传文件，可完美上传预览图片。放在根目录下可以直接运行。支持按年月自动创建上传目录，支持缩略图显示。 运行环境TOMCAT1.6下通过。 ...
由asp版本修改。补充：内容的存取，特殊字符(如引号)最好replace转义...上传bean是src\com\UploadBean.java 上传处理在\Edit\editor\upload.jsp 部分浏览器预览本地图片小红叉可改路径调试。如request.getRealPath("/")
该资源是自己做的（后台是java，页面是jsp，用了Jcrop插件裁剪图片），能实现上传本地图片,预览在页面上并根据用户的需求进行任意大小的裁剪，最后将裁剪后的图片进行展示。整个过程会把图片的名字插入数据库字段；...
点击图片弹出文件上传界面的效果，想必大家都有见到过吧，在本文为大家详细介绍下在jsp中是如何实现的，并对具体的实现代码做简要的介绍，感兴趣的朋友不要错过
微信开发入门教程 jssdk,通过config接口注入权限验证配置java+jsp微信开发教程，功能：扫描二维码，拍照、本地选图，图片预览，上传图片，下载图片，获取当前网络状态，查看地理位置，获取当前地理位置打开地图，...
微信开发入门教程 jssdk,通过config接口注入权限验证配置java+jsp微信开发教程，功能：扫描二维码，拍照、本地选图，图片预览，上传图片，下载图片，获取当前网络状态，查看地理位置，获取当前地理位置打开地图，...
Java web使用pdf.js在线预览远程服务器上的pdf文件,包里有pdf.js资源文件以及使用文档
JSP Explorer还支持文件上传和下载，您可以轻松地将文件上传到本地文件系统或云存储服务中，也可以从这些位置下载文件。它还具有与云存储服务的集成功能，包括Google Drive、Dropbox等等。 JSP Explorer是一个跨平台...
很小但是功能却很强大，编辑网页可以随时预览，能够多人工作。 附使用手册： Editplus使用技巧 技巧中，在编译器集成例子中参照了部分官方的文献。有几篇是从网上搜集来的，这里我注明了来源或原始作者。如果你是...
swfupload上传编辑器是一款支持本地上传、预览、视频拍照和网络加载的flash头像编辑上传插件，可缩放、裁剪、旋转、定位和调色等，同时支持asp、asp.net、jsp、php等多语种，详细的信息参照压缩包《插件介绍》，在线...
swfupload上传编辑器是一款支持本地上传、预览、视频拍照和网络加载的flash头像编辑上传插件，可缩放、裁剪、旋转、定位和调色等，同时支持asp、asp.net、jsp、php等多语种 代码如下: swfobject.addDomLoadEvent...
富头像上传编辑器 v1.4，可以支持asp，.net,php,jsp等，富头像上传编辑器是一款支持本地上传、预览、视频拍照和网络加载的flash头像编辑上传插件，可缩放、裁剪、旋转、定位和调色等... 小巧的身材：文件大小仅仅...