<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>上传图片本地预览效果</title> </head> <body> <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script> <input id="upload" type="file"> <img id="preview" src=""> <script type="text/javascript"> $('#upload').change(function(){ // 获取FileList的第一个元素 var f = document.getElementById('upload').files[0]; src = window.URL.createObjectURL(f); alert(src); document.getElementById('preview').src = src }) </script> </body> </html>
js实现上传图片前本地预览
2022-01-14
158
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《
阿里云开发者社区用户服务协议》和
《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写
侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
js实现上传图片前本地预览
目录
相关文章
|
7月前
|
JavaScript
|
29天前
|
JavaScript
定位技术
jQuery鹰眼视图小地图定位预览插件minimap.js
这是一个jQuery小地图定位预览视图，默认左侧是页面主要内容，minimap.js的好处就是在它的右侧形成一个快速定位通道，产生一个缩小版的页面，即预览效果，可以点击并快速定位到页面的某个位置。简单实用，欢迎下载！
30
0
0
|
3月前
|
SQL
安全
数据库
|
5月前
|
JavaScript
网页CAD（JS Vue 预览dwg)如何二次开发常用的CAD编辑功能
```markdown
# CAD网页编程概览
- 使用mxcad库，实现CAD操作如删除、复制、镜像、移动和旋转。
- `erase()`方法删除实体，`clone()`配合`transformBy()`用于复制和编辑。
- `mirror()`和`transformBy(setMirror)`执行镜像操作，基于参考线。
- `move()`和`transformBy(setToTranslation)`实现移动功能。
- `rotate()`和`transformBy(setToRotation)`进行旋转，支持角度输入。
```
261
1
1
|
5月前
|
JavaScript
js中readAsDataURL的意思，可以用于浏览器预览图像文件或者转成base64字符串
js中readAsDataURL的意思，可以用于浏览器预览图像文件或者转成base64字符串
56
0
0
|
6月前
|
JavaScript
|
5月前
|
前端开发
JavaScript
|
7月前
|
JavaScript
前端开发
|
7月前
|
JavaScript
|
7月前
使用PDF.js预览文件老是报错Message: file origin does not match viewer‘s_otherError @ app.js:1140怎么办？？
使用PDF.js预览文件老是报错Message: file origin does not match viewer‘s_otherError @ app.js:1140怎么办？？
331
0
0
热门文章
最新文章
1
JS代码位置
2
【转】Javascript关键字和保留字
3
OC与JS互相调用
4
JavaScript 操作 Cookie
5
Node.js 中流操作实践
6
如何让你的JavaScript代码更加语义化
7
js数组遍历some,foreach,map,filter,every对比
8
05.javascript访问CSS
9
第14章 使用Kotlin开发JavaScript代码 《Kotin 编程思想·实战》
10
Nightwatch.js – 轻松实现浏览器的自动测试
1
深入理解JavaScript中的事件循环机制
85
2
【MongoDB 专栏】MongoDB 的 JavaScript 引擎与脚本执行
107
3
JavaScript 数组方法概览
37
4
在JavaScript中，函数原型（Function Prototype）是一个特殊的对象
60
5
JavaScript 的数组方法 map()、filter() 和 reduce() 提供了函数式编程处理元素的方式
46
6
JavaScript 提供了多种方法来操作 DOM（文档对象模型）
47
7
JavaScript的垃圾回收机制通过标记-清除算法自动管理内存
56
8
JavaScript 的垃圾回收机制有一些潜在的缺点
41
9
nbcio-vue下载安装后运行报错，diagram-js没有安装
59
10
了解JavaScript的垃圾回收机制
39