上传图片在页面上显示

看了别人写的自己照着写了一下

<%@ 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>My JSP 'sc.jsp' starting page</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"><!----><script src="<%=basePath%>js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script>function showPicture(value){  // var docObj=document.getElementById("file");  var docObj=$("#file").get(0); // var imgObjPreview=document.getElementById("myPic");  var imgObjPreview= $("#myPic").get(0);if(docObj.files &&docObj.files[0])  {  //火狐下，直接设img属性
        imgObjPreview.style.display = 'block';  imgObjPreview.style.width = '150px';  imgObjPreview.style.height = '180px';   //imgObjPreview.src = docObj.files[0].getAsDataURL();  //火狐7以上版本不能用上面的getAsDataURL()方式获取，需要一下方式
        imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);  }  else  {  //IE下，使用滤镜
        docObj.select();  var imgSrc = document.selection.createRange().text;  // var localImagId = document.getElementById("localImg");  var localImagId = $("#localImg").get(0);  //必须设置初始大小
        localImagId.style.width = "150px";  localImagId.style.height = "180px";  //图片异常的捕捉，防止用户修改后缀来伪造图片  try{  localImagId.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";  localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;  }  catch(e)  {  alert("您上传的图片格式不正确，请重新选择!");  return false;  }  imgObjPreview.style.display = 'none';  document.selection.empty();  }  return true;
}
</script></head><body><div  id="localImg">  <img src="" id="myPic" />  </div>  <form id="form" action="#" method="post" enctype="multipart/form-data">  <input type="file" id="file" name="file" onchange="showPicture(this.value)">                         </form>  </body>
</html>

页面

转载于:https://www.cnblogs.com/yang1018/p/7365711.html

上传图片在页面上显示相关推荐

jsp 图片上传到oracle,jsp上传图片到数据库(oracle),并能在页面上显示解决办法
jsp上传图片到数据库(oracle),并能在页面上显示解决办法 jsp上传图片到数据库(oracle),并能在页面上显示解决办法日期:2014-05-18 浏览次数:20341 次 jsp上传图片 ...
[html] 如何在页面上显示Emoji表情？
[html] 如何在页面上显示Emoji表情? 如果客户端发送了一个带条件的GET 请求且该请求已被允许,而文档的内容(自上次访问以来或者根据请求的条件)并没有改变,则服务器应当返回这个304状态码. ...
python网页提交表单_Html表单——使用python在web页面上显示用户提交的数据
这个例子展示了如何使用Python完成同样的事情--在web页面上显示提交的数据. 环境配置: win10.Anaconda3 问题: 1.在安装Anaconda3的时候出现了很多问题,经建议安装旧版 ...
php怎么显示gif图片,如何让伪进度条在页面上显示成gif图像
在工作中为了方便,我们需要加上一些效果,这篇文章就和大家讲讲伪进度条如何在页面上显示gif图像,感兴趣的朋友可以参考一下,希望可以帮助到你. 最近做的一个项目中,点击某个操作后,由于后台做的事情比较多 ...
ASP.NET 用 FlexPaper 在页面上显示 PDF 文件
必要条件演示 ASP.NET 用 FlexPaper 在页面上显示 PDF 文件软件环境解决方案结构简单显示 SWF 文件上传并显示 PDF 文件常见问题参考资料其实,虽说是显示 PD ...
杜威分类法的分类规则_如何在父分类法的存档页面上显示子分类法
杜威分类法的分类规则 In the past we have shown you how to display subcategories on category pages in WordPress ...
php 导出csv文件bom,php 读取 csv 文件后, uft8bom 导致在页面上显示出现问题的解决方法...
php 读取 csv 文件后, uft8bom 导致在页面上显示出现问题的解决方法 date.csv: "ID""NAME""EMAIL" ...
csv乱码 ftp_php读取csv文件后,uft8 bom导致在页面上显示出现问题的解决方法
date.csv:"ID" "NAME" "EMAIL" "1" "小明" "xm@163 ...
html输出计算结果到文本框,在文本框中输入两个操作数和选择运算符后，在页面上显示输出结果...
需求说明: 在文本框中输入两个操作数和选择运算符后,在页面上显示输出结果实现思路: 单击"计算"按钮后,删除两个文本框左右两边的空格,删除空格后,判断输入框中是否都输入了内容,只 ...

上传图片在页面上显示

上传图片在页面上显示相关推荐

最新文章

热门文章