转载网址：http://blog.sina.com.cn/s/blog_6094f04d0100o6kj.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head>

<SCRIPT   LANGUAGE="JavaScript">

var   flag=false;

function   DrawImage(ImgD){

　　　　var image=new   Image();

　　　　image.src=ImgD.src;

　　　　if(image.width>0   &&   image.height>0){

　　　　flag=true;

　　　　if(image.width>300 || image.height>200)     {

　　　　　　ImgD.width=image.width/2;

ImgD.height=image.height/2;

　　　　　　ImgD.alt=image.width+"×"+image.height;

　　　　}    else    {

　　　　　　ImgD.width=image.width;

　　　　　　ImgD.height=image.height;

　　ImgD.alt=image.width+"×"+image.height;

　　　　}

　　}

}

function   mainChange(Value){

　　flag=false;

　　document.all.mainimage.width=5;

　　document.all.mainimage.height=5;

　　document.all.mainimage.alt="";

　　document.all.mainimage.src=Value;

　　document.all.maindiv.style.display='';

}

</SCRIPT>

<TABLE   border="0">

　　<TBODY>

　　　　<tr>

　　　　　　<td   height="22"   colspan="5">  　　　　　　

　　　　　　　　top:<input   type="file"   name="up1"   style="width:300"   class="textbox"  onChange="javascript:mainChange(this.value);">

　　　　　　</td>

　　　　</tr>

　　</TBODY>

</TABLE>

<table height="78"   border="0"   cellpadding="0"   cellspacing="0">

　　<tr>

　　　　<td  >

　　　　　　<div   id="maindiv" style="display:none">

　　　　　　　　<IMG   id=mainimage height=70 width=20 src="" onload="javascript:DrawImage(this);"   >

　　　　　　</div>

　　　　</td>

　　</tr>

</table>

<body> </body>

</html>

转载：js实现上传图片时 点击浏览后 就可以看到缩略图 很实用的更多相关文章

  1. js中怎么使点击按钮后文本框获得焦点

    <html> <head> <script type="text/javascript"> function setFocus() { docu ...

  2. 百度编辑器 Ueditor 上传图片时打开文件夹的延迟问题，点击上传图片弹窗打开慢问题

      在使用 ueditor 开发时, 作为一个web文本编辑器使用时. 当点击上传图片时, 文件夹要延迟好久才能打开. 解决: 针对多图片上传, 将/ueditor/dialogs/image/ima ...

  3. Web Uploader初始化隐藏容器失败及点击上传图片时反应较慢的问题

    问题1:在一个页面集成一个或者多个文件上传插件,初始化时有些DOM容器是隐藏的,这时候经常会出现初始化失败的情况,虽然按钮样式改变了,但是点击就是没反应(有时候不经意点了哪个地方,或许会出现文件选择框 ...

  4. 关于 百度 Ueditor 上传图片时 打开文件夹的延迟问题

    在使用 ueditor 开发时, 作为一个web文本编辑器使用时. 当点击上传图片时, 文件夹要延迟好久才能打开. 解决: 针对多图片上传, 将/ueditor/dialogs/image/image ...

  5. 百度ueditor上传图片时如何设置默认宽高度

    百度ueditor上传图片时如何设置默认宽高度 一.总结 一句话总结:直接css或者js里面限制一下就好,可以用html全局限制一下图片的最大高度 直接css或者js里面限制一下就好,可以用html全 ...

  6. 前端AntD框架的upload组件上传图片时遇到的一些坑

    前言 本次做后台管理系统,采用的是 AntD 框架.涉及到图片的上传,用的是AntD的 upload 组件. 前端做文件上传这个功能,是很有技术难度的.既然框架给我们提供好了,那就直接用呗.结果用的时 ...

  7. 关于 百度 Ueditor （在chrome浏览器） 上传图片时 打开文件夹的延迟问题

    在使用 ueditor 开发时, 作为一个web文本编辑器使用时. 当点击上传图片时, 文件夹要延迟好久才能打开. 解决: 针对多图片上传, 将/ueditor/dialogs/image/image ...

  8. 怎么用js设置a标签点击链接改变当前颜色

    怎么用js设置a标签点击链接改变当前颜色 20 例如:多个a标签为白色,当点击其中一个a标签时改变那一个a标签的字体颜色为黄色,并且跳转到对应链接,当点击下一个a标签链接时,下一个为黄色,之前一个恢复 ...

  9. 上传图片时使用crop进行裁剪

    上传图片时,往往需要对图片进行裁剪. 实现方法为: 1.引入crop.css body{background:#}.upload-container{position:absolute;left:%; ...

随机推荐

  1. 第四届CCF大数据学术会议征文通知

    第四届CCF大数据学术会议征文通知 2016年10月,兰州 近几年,大数据是各界高度关注积极布局的热点方向.2015年8月,国务院发表<促进大数据发展行动纲要>,正式将大数据提升为国家战略 ...

  2. pyqt5:标签显示文本框内容

    文本框(lineEdit)输入文本,标签(label)就会显示文本框的内容. 原理如下: 输入文本时,lineEdit控件发射信号textChanged(),label收到后触发setText()槽. ...

  3. tensorflow 使用

    1.linux 安装tensorflow ubuntu中安装:link 用pip安装的过程中,可能出现网络链接的问题,尝试多次链接,直到成功!!! python -V sudo apt-get ins ...

  4. Codeforces 276D Little Girl and Maximum XOR

    题意:给范围l,r选两个数亦或最大是多少. 思路:找到第一个l和r二进制下不相同的位置i,然后答案就是2^(i+1)-1,因为一个取0一个取1之后,后面的位置全部选1和全部选0,就是这样:011111 ...

  5. STLtoSVG,and SVG to Bmp

    先用这两个工具: Slic3R或者Skeinforge:这个两个工具的作用就是把STL文件切片为叠加的矢量图(SVG格式) 因为SVG是分层的,一层一层的把每层都转换成一张Bmp文件 听说ImageM ...

  6. QT类的继承结构

    QT类的继承结构 QT的类 core 数据集合 QString 几何类 QPoint QSize QRectangle 系统类 QColor QFont QImage QIcon QCursor QB ...

  7. url中的jsessionid解释

    (1) 这是一个保险措施 因为Session默认是需要Cookie支持的 但有些客户浏览器是关闭Cookie的 这个时候就需要在URL中指定服务器上的session标识,也就是5F4771183629 ...

  8. Linux企业级项目实践之网络爬虫（7）——DNS解析

    DNS 是Domain Name Service的缩写.域名系统为Internet上的主机分配域名地址和IP地址.IP地址不易于记忆,然而域名地址相比较而言是方便于记忆的.用户如果使用域名地址,当想获 ...

  9. first move advantage_百度搜索

    first move advantage_百度搜索 先动优势

  10. WPF - XAML如何引入名字空间

    WPF 的XAML引入名字空间的概念,经常容易让人混淆.如何引入名字空间,并且在XAML中调用其中的类,下面给一个简单的介绍. 比如我们有一个Hepler类. namespace Wheat.PIMS ...