<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. 小程序基础02:全局配置app.json

    1.配置 我们使用app.json文件来对来微信小程序进行全局配置. 作用:他决定了页面文件的路径,窗口表现,设置网络超时时间,设置多tab等 每一个小程序页面也可以使用 .json 文件来对本页面的 ...

  2. java系列: 对不起,JavaFX——Java 8目前还不能救你(zz)

    JavaFX 是SUN公司在2007年JavaOne大会上首次对外公布的以Java为基础构建的富客户端平台,更让开发者印象比较深刻的则是其背后的JavaFX开发团队,仅仅在两年的时间就从1.0版本完善 ...

  3. [CareerCup] 13.5 Volatile Keyword 关键字volatile

    13.5 What is the significance of the keyword "volatile" in C 这道题考察我们对于关键字volatile的理解,顾名思义, ...

  4. 利用Gulp优化部署Web项目[长文慎入]

    Gulp Gulp是一款项目自动化的构建工具,与Grunt一样可以通过创建任务(Task)来帮助我们自动完成一些工作流的内容.当然,今天我们的内容并不是讨论这二者的区别,仅仅是介绍介绍如何利用Gulp ...

  5. WebStorm在Mac上的快捷键(部分)

    整理一下在Mac上使用WS这款IDE的快捷键 shift + Enter 软回车 ,无论在前一行代码的什么位置,都能定位到下一行. command 显示/隐藏 左侧面板 command + b / 点 ...

  6. I2C和LCD信号干扰的解决:硬件工程师都硬不起来,让软件工程师硬着头上

    DEMO4,LCD的clk干扰I2C,I2C无法通信. 把排针压下,去掉LCD的CLK,恢复正常.     过程: 直接跳线I2C,没问题.两排针插到一起就无法通信. 一个个的排针去除,最终找到LCD ...

  7. 尝试EJB整合Mybatis部署时报错:获得带有类加载器MybatisUtil的ModuleClassLoader的反射信息出错,请问大神如何解决

    mybatis的配置 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE configurati ...

  8. Orchard 刨析:Logging

    最近事情比较多,有预研的,有目前正在研发的,都是很需要时间的工作,所以导致这周只写了两篇Orchard系列的文章,这边不能保证后期会很频繁的更新该系列,但我会写完这整个系列,包括后面会把正在研发的东西 ...

  9. (旧)子数涵数·PS ——翻页效果

    一.首先在网络上下载一张图片,作为素材.这是我下载的素材,至于为什么选择这张照片呢,当然不是因为自己的一些羞羞的念头啦. 二.打开Photoshop,我使用的版本是CS3(因为CS3所占的磁盘空间较小 ...

  10. Grovvy之解析XML文件

    假设现有customer.xml 文件内容如下: <?xml version="1.0" ?> <customers> <corporate> ...