<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. Enfold主题详解与实例视频教程 WordPress建站视频教程

    ENFOLD主题功能强大,同样的设置也相对较复杂,希望您在学习过程中也能多多加以练习.Enfold主题介绍:目前在ThemeForest网站,Enfold在WordPress主题销售排行中第2名,可见 ...

  2. swift第一季基础语法

    同: 一.基础 同: 1常量和变量 2数据类型和数据类型转换 3别名 不同: 1可选类型optional 2BOOL类型 3元组类型 4断言Assertion 二.基本操作符 同: 1赋值和算术运算及 ...

  3. java 中Handler 和Runnable 的使用 异步发送消息 转

    public class MainActivity extends Activity { TextView text1, text2; Button button; Thread th; @Overr ...

  4. node 通用的中间件

    为什么学习Node,因为他的门槛比较高一点,现在比较热门一点. 技术这种东西,用最短的时间学会了收益终身. 1.常用的中间件: // 通用的中间件 //bodyParser connect 内建的中间 ...

  5. 【BZOJ1007】【HNOI2008】水平可见直线(斜率排序+单调栈)

    1007: [HNOI2008]水平可见直线 Time Limit: 1 Sec  Memory Limit: 162 MBSubmit: 2605  Solved: 914[Submit][Stat ...

  6. [wikioi 2845]排序的代价(置换群)

    有一列数,要对其进行排序(升序).排序只能通过交换来实现.每次交换,可以选择这列数中的任意二个,交换他们的位置,并且交换的代价为二个数的和.排序的总代价是排序过程中所有交换代价之和.先要求计算,对于任 ...

  7. linux中的数值运算

    一.declare 作用:声明变量类型,bash默认变量为字符串类型的,并且字符串在拼接时直接拼接,不需要加号 使用方法: 二.数值运算 加法运算 a= b= c=$(($a+$b)) echo $c

  8. 前端自动化神器LiveReload配合浏览器和less/sass使用方法

    前言:搜了半天,各种推荐,什么十大工具啦.优秀工具集合啦之类的咸淡文章,就是没有一个讲怎么弄的.配合官网的article自己研究了半天总算配置好了.顺便吐槽下官网关于sass/less设置这块说的模糊 ...

  9. Calender的使用详解

    Calendar和GregorianCalendar简介 Calendar的中文翻译是日历,实际上,在历史上有着许多种计时的方法.所以为了计时的统一,必需指定一个日历的选择.那现在最为普及和通用的日历 ...

  10. hdu2594 KMP

    2个字符长合并在一起即可.要注意next[n]的值要小于初始的两个字符串的长度; //next[]存的是之前相同的长度. //也是位置,只是s[i]不一定和s[next[i]]相同 //但是i之前的和 ...