jquery预览本地图片
本人qq群也有许多的技术文档,希望可以为你提供一些帮助(非技术的勿加)。
QQ群: 281442983 (点击链接加入群:http://jq.qq.com/?_wv=1027&k=29LoD19) QQ:1542385235
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
|
<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="Generator" content="EditPlus®"><meta name="Author" content="buexplain"><meta name="Keywords" content=""><meta name="Description" content=""><title>Document</title><script src="jquery.js"></script></head><body> <input type="file" id="imgfile"> <img id="imgsrc" src=""> <script> $(function() { $("#imgsrc").hide(); $("#imgfile").change(function() { var objUrl = getObjectURL(this.files[0]); console.log("objUrl = " + objUrl); if (objUrl) { $("#imgsrc").attr("src", objUrl); $("#imgsrc").show(); } }); function getObjectURL(file) { var url = null; if (window.createObjectURL != undefined) { // basic url = window.createObjectURL(file); } else if (window.URL != undefined) { // mozilla(firefox) url = window.URL.createObjectURL(file); } else if (window.webkitURL != undefined) { // webkit or chrome url = window.webkitURL.createObjectURL(file); } return url; } }); </script></body></html> |
本人qq群也有许多的技术文档,希望可以为你提供一些帮助(非技术的勿加)。
QQ群: 281442983 (点击链接加入群:http://jq.qq.com/?_wv=1027&k=29LoD19) QQ:1542385235
我的淘宝店,可以进去逛逛噢:https://shop108912636.taobao.com/index.htm?spm=2013.1.w5001-7867000954.3.1d29318dPlLar7&scene=taobao_shop
jquery预览本地图片的更多相关文章
- IE7+ 浏览器兼容预览本地图片
css #preview_fake { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale); o ...
- vue预览本地图片
<template> <div> <a href="javascript:void(0);" @change="addImage" ...
- 预览本地图片原生js
<!-- 样似总结: 用a标签代替file,做文件上传. 将file进行绝对定位,透明度设置为0:宽度为“上传图片”的宽度,超出部分隐藏. 这样做是为了将file隐藏起来.用a标签代替file ...
- javascript预览本地图片
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 一款基于jQuery可放大预览的图片滑块插件
今天给大家分享一款基于jQuery可放大预览的图片滑块插件.这款jQuery焦点图插件的特点是可以横向左右滑动图片,并且点击图片可以进行放大预览,唯一的缺陷是这款焦点图并不能循环切换,如果你有较好的J ...
- 基于HTML5的可预览多图片Ajax上传
一.关于图片上传什么什么的 在XHTML的时代,我们使用HTML file控件上传图片一次只能上传一张.要一次上传多图,做法是借助于flash.例如swfupload.js.可惜,使用复杂的点,比如f ...
- input type=file实现图片上传,预览以及图片删除
背景 前两天在做一个PC网站的意见反馈,其中涉及到了图片上传功能,要求可以上传多张图片,并且支持图片上传预览及图片删除, 图片上传这一块以前没怎么搞过,而且一般也很少会碰到这样的需求,所以在做这个功能 ...
- HTML5可预览多图片ajax上传(使用formData传递数据)
HTML5可预览多图片ajax上传(使用formData传递数据) 在介绍上传图片之前,我们简单的来了解下FormData的基本使用:介绍完成后这些基本知识后,我们会在文章最后提供一个demo,就是a ...
- es5预览本地文件、es6练习代码演示案例
es6简单基础: <!DOCTYPE html> <html> <head> <meta name="viewport" content= ...
随机推荐
- java 对象转整数,两个整数相除转百分数
public class MathUtil { public static void main(String[] args) { System.out.println(toPercent(1,3)); ...
- iOS解决表格中TextField,TextView编辑时,输入框被键盘遮挡的问题
方法1:在原来的 UIViewController 内部再添加一层 UITableViewController 代码如下 : // // ViewController.m // 键盘遮挡问题 // / ...
- Cmake + VS2013编译opencv
下载之后,使用cmake转为vs解决方案的时候,配置OPENCV_EXTRA_MODULES_PATH=<path to opencv_contrib/modules/>,然后才能使用ex ...
- Ubuntu虚拟机共享文件夹的1234
第一 在虚拟机内添加路径 进入虚拟机软件,点开工具栏上方虚拟机,点击设置,选择选项,查看共享文件夹,点击添加,下一步 第二: 第三 点击启用此共享 点击完成 第四 查看共享的文件 在mnt里可以看到S ...
- Java中volatile关键字的最全总结
转载至:https://blog.csdn.net/u012723673/article/details/80682208 关于volatile很重要的一点: 它保证了可见性,即其他线程对volati ...
- AppDomain介绍
一.建立控制台项目 二.更改Program为ADSetp 三.去掉命名空间AppDomain.CurrentDomain 四.贴代码 using System; using System.IO; us ...
- Linux 命令 watch 监测命令的运行结果
watch 命令周期性地执行命令,全屏显示输出命令.watch命令可以监测一个命令的运行结果 命令参数 -n, --interval 设置间隔时间.默认情况下,watch 每隔 2 秒执行一次命令. ...
- Vector和ArrayList的区别联系,Hashtable和HashMap的区别联系
Vector.Hashtable是早期的集合类,线程安全,但是效率低下,被相同原理.结构的ArrayList.HashMap取代. 1.Vector和ArrayList的区别和联系: 联系:实现原理相 ...
- MySQL数据库常用引擎
在MySQL数据库中,常用的引擎主要就是2个:Innodb和MyIASM. 首先: 1.简单介绍这两种引擎,以及该如何去选择.2.这两种引擎所使用的数据结构是什么. 1. a.Innodb引擎,Inn ...
- Android Studio 如何获取 text文本内容
1.找到目录的main先建立assets格式的文件夹 2.再把需要读取的txt 文件放入到该文件夹下(名字随意),这里取 list.txt. 文件内容 格式如下 3.读取文本内容 工具代码 /** * ...