上传图片在页面上显示

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

<%@ 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>

页面

时间: 2024-08-26 02:26:48

上传图片在页面上显示的相关文章

访问asp网站时,页面上显示请求的资源在使用中

服务器生产环境: 操作系统:WIN2003 WEB:IIS 6.0 问题过程: 9月7日上午8:40左右,科研处长发现他们的网站无法登录,网上留言了我,当我进一步了解情况时,发现还有几个二级网站出现如下情况: 浏览器访问asp网站时,页面上显示请求的资源在使用中:有的ASP网站又可以正常访问,这就带来了一些困难,不知所措,到底发生了什么原因?如果在网上搜集一下,说一大堆原因,实际上一一测试,但无法解决. 此时此刻,心理非常紧张,又在抓紧时间进一步分析,如何解决此次网站运行故障. 通过以下设置,可

#1 如何在 HTML页面上显示HTML代码

今天把数据库里面的文章内容输出到界面上,遇到了一个问题.文章内容没有全部书出来,在某个地方被阶段了,纠结了好久,后来发现问题. 问题出现在:“<meta charset="utf-8″>” 在数据库文章表里的 文章中有 “<meta charset="utf-8″>”   这个东西,然后查询出来到服务端.查询出来的结果是没问题的. 但是我用 response.write(item.Content);   // item.Content 是文章表里面内容字段. 输

PHP-----作业:查询数据,在页面上显示

作业:查询INFO表所有数据,显示在页面上(表格)性别要显示男女 民族 显示民族名称 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml">

怎样在一个WEB页面上显示当前月历

第一次写博客,最近一直在忙毕业设计.今晚抽了些时间修改一些当时发现了却不想去修改的小错误,在我的系统的用户主页上,曾经为了填补页面的空白,我自己用JavaScript写了月历小插件放上去了.但是后来发现很多时候月历的星期并不准确,想了想知道是在打印月历的时候第一行的空白的算法出问题了.但是被这个项目一直整得很烦的我当时并不想去修改这个问题,今天晚上突然有兴致改了改它,也小怡情一下,写到这里跟大家分享一下. 好了,废话不说了,上正题!写一个日历小插件呢,别的都很简单,什么判断闰.平年和当月天数就不

MVC设计模式下实现数据库的连接,并获取所有数据到浏览器页面上显示

实现建立一个学生的java类:里面封装了属性的全部属性: public class Student { private int id; private String username; private String password; public Student() { super(); } public Student(int id, String username, String password) { super(); this.id = id; this.username = user

网络应用发布到linux上的web服务器上页面上显示麻将牌式字符的问题

什么是麻将牌式字符,就是中文显示为一个竖立长方形框框里面有四个数字或字母,请看下图中中文,日文和韩文的显示就知道了: 为什么会遇到这个问题? 系统不支持中文,日文和韩文字体. 如何解决: 安装中文字体,日文字体和韩文字体. 参考: 1.如何在Linux下如何安装多语言包 2.linux安装中文语言包 为什么一般不会遇到这个问题? 因为安装系统时一般都选择或默认选择了多语言支持. 注意: 由于问题是别人问我的,目前还没有最终解决,具体步骤等完成后再补充. 补充: 同事说他用rpm搜索 "fonts

JavaScript 在页面上显示数字时钟

显示一个钟表 <html> <head> <script type="text/javascript"> function startTime() { var today=new Date() var h=today.getHours() var m=today.getMinutes() var s=today.getSeconds() // add a zero in front of numbers<10 m=checkTime(m) s=

Sharepoint2013:在页面上显示错误信息

在sharepoint2013中我们需要修改以下三处的web.config,以显示错误信息 1, C:\inetpub\wwwroot\wss\VirtualDirectories\端口号\web.config 1>将customErrors元素中的mode将成Off <customErrors mode="Off" /> 2>将SafeMode中的CallStack改成True <SafeMode MaxControls="200"

Rapha&#235;l 是一个小型的 JavaScript 库,用来简化在页面上显示向量图的工作。你可以用它在页面上绘制各种图表、并进行图片的剪切、旋转等操作。

点这里 在线效果演示:http://raphaeljs.com/pie.html http://raphaeljs.com github: https://github.com/DmitryBaranovskiy/raphael