JS 图片预览功能
<script type="text/javascript">
function DisplayImage(fileTag) {
document.getElementById('viewfile').value = fileTag.value;
fileTag.style.display = 'none';
var allowExtention = ".jpg.png.gif.JPG.PNG.GIF";
var extentionArr = fileTag.value.split('.');
var extention = extentionArr[extentionArr.length - 1];
if (!(allowExtention.indexOf(extention) > -1)) {
alert("请选择图片!");
} else {
//for adveced broswer(the newest ie,chrome,ff)
if (typeof (FileReader) !== "undefined") {
var reader = new FileReader();
reader.readAsDataURL(fileTag.files[0]);
reader.onload = function (e) {
document.getElementById("img_1").setAttribute("src", e.target.result);
}
} else {
//for(ie6)
document.getElementById("img_1").setAttribute("src", fileTag.value);
}
}
}
</script>
JS 图片预览功能的更多相关文章
- JS——图片预览功能
<script type="text/javascript"> function DisplayImage(fileTag) { document. ...
- 如何通过js实现图片预览功能
一.效果预览 效果图: 二.实现代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...
- H5图片预览功能
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- 原生JS实现图片预览功能
html代码: <div class="album-new fr"> <div class="upload-btn btn-new container& ...
- 原生js实现ajax的文件异步提交功能、图片预览功能.实例
采用html5使得选择图片改变时,预览框中图片随之改变.input文件选择框美化.原生js完成文件异步提交 效果图: 代码如下,可直接复制并保存为html文件打开查看效果 <html> & ...
- JS 上传图片 + 预览功能(一)
JS 上传图片 + 预览功能 <body> <input type="file" id="fileimg1" style="disp ...
- HTML5实现图片预览功能
两种方式实现 URL FileReader Index.jsp文件 <%@page contentType="text/html" pageEncoding="UT ...
- vue.js 图片预览
Vue.js的图片预览的插件还是不少,但是找了半天还是没找到跟现在项目里能用得很顺手的,其实项目里图片预览功能很简单,点击放大,能双指缩放就可以了.部分vue.js的图片预览库都需要把图片资源单独拿出 ...
- 自定义type为file型input控件+该控件具有本地图片预览功能
最近的一个项目需求是写一个type为filex型的input控件,这个控件: 第一,要自定义样式: 第二,要能直接在本地预览上传的图片: 第三,要能检测图片的尺寸是否符合要求. 故综合网上的资源写了下 ...
随机推荐
- Grand Central Dispatch(GCD)详解(转)
概述 GCD是苹果异步执行任务技术,将应用程序中的线程管理的代码在系统级中实现.开发者只需要定义想要执行的任务并追加到适当的Dispatch Queue中,GCD就能生成必要的线程并计划执行任务.由于 ...
- 生产环境 tomcat中启动缓慢
具体的原因没研究,大概是一个随机数种子生成的速度拖慢了,直接copy一份解决方案,属于备忘材料 解决 有两种解决办法: 1)在Tomcat环境中解决 可以通过配置JRE使用非阻塞的Entropy So ...
- 12 hdfs常用文件、目录拷贝操作、删除操作
package com.da.hbase.tool.utils; import com.da.hbase.tool.common.Const; import org.apache.hadoop.con ...
- PHP内置Web Server探究(二)自定义PHP控制台输出console函数
我们在开发APP的服务器端,当和APP进行联调时通常需要实时跟踪URL请求和参数的接收情况. 但PHP并没有像Python或Java专有的控制台输出函数,Python的print()和Java的Sys ...
- mysql for python,银行转账模拟
学习中, 本人为初学者.勿喷. #-*- coding:utf-8 -*- import MySQLdb class Tranferaccount(object): def __init__(self ...
- Lintcode--009(单词切分)
http://www.lintcode.com/zh-cn/problem/word-break/ 单词切分 给出一个字符串s和一个词典,判断字符串s是否可以被空格切分成一个或多个出现在字典中的单词. ...
- win7系统64位"禁用驱动程序签名强制"如何设置?
换了Win7系统64位旗舰版的朋友是不是都发现了一点,以前32位Win7系统用的好好的小程序小应用,一下子就装不上了.这是由于Win7系统64位系统对于未有认证签名的驱动程序进行了限制安装,而大部分小 ...
- NHibernate 帮助类(单例实际运用)
在NHibernate中,ISessionFactory是线程安全的,对应一个数据库.它是生成ISession的工厂.而ISession是线程不安全的. 创建一个ISessionFactory需要消耗 ...
- IIS Express 的 applicationhost.config配置文件
文件所在目录 C:\Users\admin\Documents\IISExpress\config 或者 C:\Program Files\IIS Express\AppServer\ //加载语言文 ...
- Git for windows GUI使用
试用了下CSDN的Code 期间还遇到一个错误 http://blog.csdn.net/utstarm/article/details/8249853 这个新手教程写得不错 https://code ...