<style type="text/css">
#preview /*这个就是预览的DIV的ID*/
{
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);
}
</style> <script type="text/javascript">
<!--
function preview(img,width,height){
var newPreview = document.getElementById("preview");
var url = img.value; var fileext=url.substring(url.lastIndexOf("."),url.length);
fileextfileext=fileext.toLowerCase();
if((fileext!='.jpg')&&(fileext!='.gif')&&(fileext!='.jpeg')&&(fileext!='.png')&&(fileext!='.bmp')){
alert("对不起,系统仅支持标准格式的照片,请您调整格式后重新上传!");
document.applyForm.upload.focus();
document.getElementById("sub").disabled=true;
}else{
document.getElementById("sub").disabled=false;
newPreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = url;
newPreview.style.width = width+"px";
newPreview.style.height = height+"px";
}
}
//-->
</script> <input type="file" name="upload" onchange="preview(this,300,200)" />
<div id="preview"></div><br/>
<input type="submit" value="提交" id="sub" disabled="true"/>

JS实现上传本地图片前先预览的更多相关文章

  1. KindEditor上传本地图片在ASP.NET MVC的配置

    http://www.cnblogs.com/upupto/archive/2010/08/24/1807202.html 本文解决KindEditor上传本地图片在ASP.NET MVC中的配置. ...

  2. .net mvc4 利用 kindeditor 上传本地图片

    http://blog.csdn.net/ycwol/article/details/41824371?utm_source=tuicool&utm_medium=referral 最近在用k ...

  3. tinymce4.x 上传本地图片(自己写个插件)

    tinymce是一款挺不错的html文本编辑器.但是添加图片是直接添加链接,不能直接选择本地图片. 下面我写了一个插件用于直接上传本地图片. 在tinymce的plugins目录下新建一个upload ...

  4. tinymce4.x 上传本地图片 (转载)

    转载自:http://www.cnblogs.com/fhen/p/5809514.html tinymce4.x 上传本地图片   tinymce是一款挺不错的html文本编辑器.但是添加图片是直接 ...

  5. 图片上传-本地图片转base64+ie8支持+本地预览支持

    最近项目由于flash同学没在了,图片上传只能前端重新做,后台希望用base64数据上传,复用之前接口 问题来了, 1.ie8 不支持canvas转base64 2.本地预览 base64数据,ie8 ...

  6. .net core版 文件上传/ 支持批量上传,拖拽以及预览,bootstrap fileinput上传文件

    asp.net mvc请移步 mvc文件上传支持批量上传,拖拽以及预览,文件内容校验 本篇内容主要解决.net core中文件上传的问题  开发环境:ubuntu+vscode 1.导入所需要的包:n ...

  7. java压缩包上传,解压,预览(利用editor.md和Jstree实现)和下载

    java压缩包上传,解压,预览(利用editor.md和Jstree实现)和下载 实现功能:zip文件上传,后台自动解压,Jstree树目录(遍历文件),editor.md预览 采用Spring+Sp ...

  8. 个人永久性免费-Excel催化剂功能第102波-批量上传本地图片至网络图床(外网可访问)

    自我突破,在100+功能后,再做有质量的功能,非常不易,相对录制视频这些轻松活,还是按捺不住去写代码,此功能虽小,但功课也做了不少,希望对真正有需要的群体带来一些惊喜. 背景介绍 图床的使用,一般是写 ...

  9. Android实现本地图片选择及预览缩放效果仿春雨医生

    在做项目时常常会遇到选择本地图片的需求.曾经都是懒得写直接调用系统方法来选择图片.可是这样并不能实现多选效果.近期又遇到了,所以还是写一个demo好了.以后也方便使用.还是首先来看看效果 显示的图片使 ...

随机推荐

  1. CSS 动画之十-图片+图片信息展示

    这个动画主要是运用了一些css3的特性,效果是展示一张商品图片,然后在商品图片的制定位置显示该商品的详细信息.效果在chrome浏览器中预览. <!DOCTYPE html> <ht ...

  2. Java 通过JDBC查询数据库表结构(字段名称,类型,长度等)

    Java 通过JDBC查询数据库表结构(字段名称,类型,长度等) 发布者:唛唛家的豆子   时间:2012-11-20 17:54:02   Java 通过JDBC查询数据库表结构(字段名称,类型,长 ...

  3. [CareerCup] 1.4 Replace Spaces 替换空格

    1.4 Write a method to replace all spaces in a string with '%20'. You may assume that the string has ...

  4. beta阶段140字评论

    第一组 奋斗吧兄弟  有三种生态环境可以选择,动物还可以放大缩小,增加了许多趣味性.寓教于乐 第二组金州勇士   考试系统很贴近学生生活,不过这种系统现有也挺成熟了,其实我觉得做一个报考系统可能更讨喜 ...

  5. Atom使用心得 - 21世纪的编辑器

    Atom使用心得 - 21世纪的编辑器 Atom下载 Atom简介:是专门为程序员推出的一个跨平台文本编辑器.具有简洁和直观的图形用户界面,并有很多有趣的特点:支持CSS,HTML,JavaScrip ...

  6. HTML5 IE兼容问题

    最近,为公司做产品的时候用到了HTML5,用IE11打开的时候出现了界面乱或者加载js错误的问题. IE10 or IE11 :Browser Mode is IE10 .Document Mode: ...

  7. 多个div背景图无缝拼接

    公司在做环形进度条的时候遇到了这个问题,上网一搜,原来是因为两个div背景图拼接起来的,所以中间出现了必不可少的缝隙,最后把position改为relative,再加个margin:0,就解决好了,下 ...

  8. DOM系列---进阶篇

    内容提纲: 1.DOM类型 2.DOM扩展 3.DOM操作内容 一.DOM类型 DOM基础篇中,我们了解了DOM的节点并且了解怎样查询和操作节点,而本身这些不同的节点,又有着不同的类型.   DOM类 ...

  9. log4j1 插入mysql

    做任务需要用到这样的需求: 使用log4j 1.2进行日志管理. 将日志输出到mysql中 系统数据库表利用脚本每日生成一张,插入系统运行时特定的表中. 实现方法 properties(放在项目根目录 ...

  10. java并发库--锁

    synchronized的缺陷: 被synchronized修饰了,当一个线程获取了对应的锁,并执行该代码块时,其他线程便只能一直等待,等待获取锁的线程释放锁,获取线程被阻塞时,没有释放锁会导致等待线 ...