纯JS实现本地图片预览的方法


Posted in Javascript onJuly 31, 2015

本文实例讲述了纯JS实现本地图片预览的方法。分享给大家供大家参考。具体如下:

刚突然看到,网上已经有很多类似的代码,但没找到一个合适的。就拿自己以前写的写了一个。代码比较简洁,引用了一个我之前写的js.方法可以单独剥离出来使用,未测太多兼容。本机浏览器基本都支持(IE,FF,Chrome)

index.html如下:

<html>
<head>
<title>Test</title>
<script type="text/javascript" src="js/z.js"></script>
</head>
<body>
<center>
  <img id="img" src="" /><p />
  <input type="file" id="file" />
</center>
<script>
  z.plimg(z.$('file'),z.$('img'),function(file,img,url){
    alert(url);
  });
</script>
</body>
</html>

z.js点击此处本站下载。

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
javascript模拟实现C# String.format函数功能代码
Nov 25 Javascript
Jquery实现点击按钮,连续地向textarea中添加值的实例代码
Mar 08 Javascript
JS中的==运算: [''] == false —&gt;true
Jul 24 Javascript
JS IOS/iPhone的Safari浏览器不兼容Javascript中的Date()问题如何解决
Nov 11 Javascript
详解Angular的内置过滤器和自定义过滤器【推荐】
Dec 26 Javascript
JS中正则表达式全局匹配模式 /g用法详解
Apr 01 Javascript
详解vue移动端日期选择组件
Feb 22 Javascript
JavaScript实现一个简易的计算器实例代码
May 10 Javascript
使用vuex存储用户信息到localStorage的实例
Nov 11 Javascript
Vue+elementUI实现多图片上传与回显功能(含回显后继续上传或删除)
Mar 23 Javascript
Vue中key的作用示例代码详解
Jun 10 Javascript
15个值得收藏的JavaScript函数
Sep 15 Javascript
javascript动画算法实例分析
Jul 31 #Javascript
jquery实现手机号码选号的方法
Jul 31 #Javascript
javascript文本模板用法实例
Jul 31 #Javascript
Javascript实现网络监测的方法
Jul 31 #Javascript
jquery模拟alert的弹窗插件
Jul 31 #Javascript
JSON字符串转JSON对象
Jul 31 #Javascript
javascript实现简单的页面右下角提示信息框
Jul 31 #Javascript
You might like
用PHP和ACCESS写聊天室(十)
2006/10/09 PHP
php foreach、while性能比较
2009/10/15 PHP
《PHP编程最快明白》第五讲:php目录、文件操作
2010/11/01 PHP
php设计模式 State (状态模式)
2011/06/26 PHP
php使用PDO方法详解
2014/12/27 PHP
mysql desc(DESCRIBE)命令实例讲解
2016/09/24 PHP
PHP数据库处理封装类实例
2016/12/24 PHP
Ubuntu上安装yaf扩展的方法
2018/01/29 PHP
php实现微信公众平台发红包功能
2018/06/14 PHP
提高Laravel应用性能方法详解
2019/06/24 PHP
复制本贴标题和地址的js代码
2008/07/01 Javascript
javascript getElementsByName()的用法说明
2009/07/31 Javascript
javascript中callee与caller的用法和应用场景
2010/12/08 Javascript
javascript开发技术大全 第4章 直接量与字符集
2011/07/03 Javascript
js页面跳转的问题(跳转到父页面、最外层页面、本页面)
2013/08/14 Javascript
JavaScript设计模式之单件模式介绍
2014/12/28 Javascript
JavaScript在网页中画圆的函数arc使用方法
2015/11/13 Javascript
整理Javascript流程控制语句学习笔记
2015/11/29 Javascript
vue中使用localstorage来存储页面信息
2017/11/04 Javascript
JS实现的JSON数组去重算法示例
2018/04/11 Javascript
Cookbook组件形式:优化 Vue 组件的运行时性能
2018/11/25 Javascript
解决layui的form里的元素进行动态生成,验证失效的问题
2019/09/14 Javascript
浅谈js数组splice删除某个元素爬坑
2020/10/14 Javascript
如何搭建一个完整的Vue3.0+ts的项目步骤
2020/10/18 Javascript
windows环境下tensorflow安装过程详解
2018/03/30 Python
python和pygame实现简单俄罗斯方块游戏
2021/02/19 Python
python实现单链表中删除倒数第K个节点的方法
2018/09/28 Python
Pycharm使用之设置代码字体大小和颜色主题的教程
2019/07/12 Python
python找出列表中大于某个阈值的数据段示例
2019/11/24 Python
Python+Opencv实现把图片、视频互转的示例
2020/12/17 Python
德国百年厨具品牌WMF美国站:WMF美国
2016/09/12 全球购物
同学聚会主持词
2014/03/18 职场文书
销售求职信范文
2014/05/26 职场文书
中药学专业毕业生推荐信
2014/07/10 职场文书
2014年司法局工作总结
2014/12/11 职场文书
Java8利用Stream对列表进行去除重复的方法详解
2022/04/14 Java/Android