转载网址：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. 详解PHP的__set()、__get()、__isset()、unset()四个方法

    PHP系统中给我们提供了很多预定义的方法,这些方法大部分都需要在类中声明,只有需要时才添加到类中.它们的作用.方法名称.使用的参数列表和返回值都是在PHP中预定好的,并且都是以两个下划线开始的方法名称 ...

  2. windows下配置lamp环境(3)---配置PHP5.4

    下面配置php Php文件夹里有两个php.ini-*文件,随便修改一个,去掉后缀,变成php.ini (如图) 打开php.ini ,添加php扩展目录723行左右(其实放哪都无所谓,只不过php. ...

  3. 作为一个新人，怎样学习嵌入式Linux，（韦东山）

    很早以前在网上看到的韦东山老师写的文章,复制到自己的博客,方便自己以后看. 在学习嵌入式Linux之前,肯定要有C语言基础.汇编基础有没有无所谓(就那么几条汇编指令,用到了一看就会). C语言要学到什 ...

  4. 这样就算会了PHP么？-7

    循环之类的例子 <script language="javascript"> function calculate(a, b) { return a * b; } do ...

  5. java,C#接口与C++的虚基类

    看C#的接口感觉就像C++中继承并实现虚基类的函数方法一样,是OOP编程中表现多态的一种方式.可以参考下面的文章: http://blog.sina.com.cn/s/blog_60ff8f1b010 ...

  6. move 表索引失效

    SQL> select INDEX_NAME,status from user_indexes; INDEX_NAME       STATUS ------------------------ ...

  7. baike并行计算概念

    并行计算 概论 ▪ 高性能计算 ▪ 计算机集群 ▪ 分布式计算 ▪ 网格计算 ▪ 云端运算         方式 ▪ Bit-level parallelism ▪ Instruction level ...

  8. Codeforces Round #272 (Div. 1) Problem C. Dreamoon and Strings

    C. Dreamoon and Strings time limit per test 1 second memory limit per test 256 megabytes input stand ...

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

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

  10. PHP设计模式笔记三：三种基本设计模式（工厂模式、单例模式、注册树模式） -- Rango韩老师 http://www.imooc.com/learn/236

    一.工厂设计模式 index.php $db = IMooc\Factory::createDatabase(); 使用工厂类的静态方法直接创建一个dababase对象,当类名发生修改时,在工厂里修改 ...