JS实现上传本地图片前先预览
<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实现上传本地图片前先预览的更多相关文章
- KindEditor上传本地图片在ASP.NET MVC的配置
http://www.cnblogs.com/upupto/archive/2010/08/24/1807202.html 本文解决KindEditor上传本地图片在ASP.NET MVC中的配置. ...
- .net mvc4 利用 kindeditor 上传本地图片
http://blog.csdn.net/ycwol/article/details/41824371?utm_source=tuicool&utm_medium=referral 最近在用k ...
- tinymce4.x 上传本地图片(自己写个插件)
tinymce是一款挺不错的html文本编辑器.但是添加图片是直接添加链接,不能直接选择本地图片. 下面我写了一个插件用于直接上传本地图片. 在tinymce的plugins目录下新建一个upload ...
- tinymce4.x 上传本地图片 (转载)
转载自:http://www.cnblogs.com/fhen/p/5809514.html tinymce4.x 上传本地图片 tinymce是一款挺不错的html文本编辑器.但是添加图片是直接 ...
- 图片上传-本地图片转base64+ie8支持+本地预览支持
最近项目由于flash同学没在了,图片上传只能前端重新做,后台希望用base64数据上传,复用之前接口 问题来了, 1.ie8 不支持canvas转base64 2.本地预览 base64数据,ie8 ...
- .net core版 文件上传/ 支持批量上传,拖拽以及预览,bootstrap fileinput上传文件
asp.net mvc请移步 mvc文件上传支持批量上传,拖拽以及预览,文件内容校验 本篇内容主要解决.net core中文件上传的问题 开发环境:ubuntu+vscode 1.导入所需要的包:n ...
- java压缩包上传,解压,预览(利用editor.md和Jstree实现)和下载
java压缩包上传,解压,预览(利用editor.md和Jstree实现)和下载 实现功能:zip文件上传,后台自动解压,Jstree树目录(遍历文件),editor.md预览 采用Spring+Sp ...
- 个人永久性免费-Excel催化剂功能第102波-批量上传本地图片至网络图床(外网可访问)
自我突破,在100+功能后,再做有质量的功能,非常不易,相对录制视频这些轻松活,还是按捺不住去写代码,此功能虽小,但功课也做了不少,希望对真正有需要的群体带来一些惊喜. 背景介绍 图床的使用,一般是写 ...
- Android实现本地图片选择及预览缩放效果仿春雨医生
在做项目时常常会遇到选择本地图片的需求.曾经都是懒得写直接调用系统方法来选择图片.可是这样并不能实现多选效果.近期又遇到了,所以还是写一个demo好了.以后也方便使用.还是首先来看看效果 显示的图片使 ...
随机推荐
- CSS 动画之十-图片+图片信息展示
这个动画主要是运用了一些css3的特性,效果是展示一张商品图片,然后在商品图片的制定位置显示该商品的详细信息.效果在chrome浏览器中预览. <!DOCTYPE html> <ht ...
- Java 通过JDBC查询数据库表结构(字段名称,类型,长度等)
Java 通过JDBC查询数据库表结构(字段名称,类型,长度等) 发布者:唛唛家的豆子 时间:2012-11-20 17:54:02 Java 通过JDBC查询数据库表结构(字段名称,类型,长 ...
- [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 ...
- beta阶段140字评论
第一组 奋斗吧兄弟 有三种生态环境可以选择,动物还可以放大缩小,增加了许多趣味性.寓教于乐 第二组金州勇士 考试系统很贴近学生生活,不过这种系统现有也挺成熟了,其实我觉得做一个报考系统可能更讨喜 ...
- Atom使用心得 - 21世纪的编辑器
Atom使用心得 - 21世纪的编辑器 Atom下载 Atom简介:是专门为程序员推出的一个跨平台文本编辑器.具有简洁和直观的图形用户界面,并有很多有趣的特点:支持CSS,HTML,JavaScrip ...
- HTML5 IE兼容问题
最近,为公司做产品的时候用到了HTML5,用IE11打开的时候出现了界面乱或者加载js错误的问题. IE10 or IE11 :Browser Mode is IE10 .Document Mode: ...
- 多个div背景图无缝拼接
公司在做环形进度条的时候遇到了这个问题,上网一搜,原来是因为两个div背景图拼接起来的,所以中间出现了必不可少的缝隙,最后把position改为relative,再加个margin:0,就解决好了,下 ...
- DOM系列---进阶篇
内容提纲: 1.DOM类型 2.DOM扩展 3.DOM操作内容 一.DOM类型 DOM基础篇中,我们了解了DOM的节点并且了解怎样查询和操作节点,而本身这些不同的节点,又有着不同的类型. DOM类 ...
- log4j1 插入mysql
做任务需要用到这样的需求: 使用log4j 1.2进行日志管理. 将日志输出到mysql中 系统数据库表利用脚本每日生成一张,插入系统运行时特定的表中. 实现方法 properties(放在项目根目录 ...
- java并发库--锁
synchronized的缺陷: 被synchronized修饰了,当一个线程获取了对应的锁,并执行该代码块时,其他线程便只能一直等待,等待获取锁的线程释放锁,获取线程被阻塞时,没有释放锁会导致等待线 ...