超简单的jq图片上传
<label class="file_img" for="file_imgs">
<input class="file_imgs" id='file_imgs' type="file" accept="image/jpg,image/jpeg,image/png" name="file" />
<img class="file_imgb" src="./images/file_img.jpg">
</label>
<div class="show_imgs"> </div>
html
$('#file_imgs').on('change',function () {
var file = $('#file_imgs').get(0).files[0];
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onloadend = function () {
console.log(reader);
$('.show_imgs').append(`<img class="show_imgs_item" src="${reader.result}" />`);
}
})
超简单的jq图片上传的更多相关文章
- jq 图片上传前预览
html: <div class="form_upload"> <input type="file" id="uploadImg&q ...
- jq 图片上传
1.html <input type="file" class="ImgInput" name="ImgInput"/> 2.j ...
- SpringBoot图片上传(三)——调用文件上传项目的方法(同时启动两个项目)
简单说明:图片上传有一个专门的工程A,提供了图片的上传和下载预览,工程B涉及到图片上传以及回显,都是调用的工程A的方法,言外之意就是要同时启动两个项目. 代码: //工程B的html代码 <di ...
- Retrofit 2.0 超能实践(三),轻松实现文件/多图片上传/Json字符串
文:http://blog.csdn.net/sk719887916/article/details/51755427 Tamic 简书&csdn同步 通过前两篇姿势的入门 Retrofit ...
- 简单2步实现 asp.net mvc ckeditor 图片上传
1.打开ckeditor 包下的 config.js,添加一句 配置(PS:ckeditor 很多功能都在该配置文件里配置),如下: config.filebrowserImageUploadUrl ...
- 一个简单的安卓+Servlet图片上传例子
例子比较 简单,服务端为Java Web Servlet,doPost方法中接收图片并保存,然后将保存的图片名返回给客户端,关键代码: @SuppressWarnings("deprecat ...
- UEditor之实现配置简单的图片上传示例
UEditor之实现配置简单的图片上传示例 原创 2016年06月11日 18:27:31 开心一笑 下班后,阿华到楼下小超市买毛巾,刚买完出来,就遇到同一办公楼里另一家公司的阿菲,之前与她远远的有过 ...
- ASP.NET Core 简单实现七牛图片上传(FormData 和 Base64)
ASP.NET Core 简单实现七牛图片上传(FormData 和 Base64) 七牛图片上传 SDK(.NET 版本):https://developer.qiniu.com/kodo/sdk/ ...
- jq实现批量图片上传
http://blog.csdn.net/lmj623565791/article/details/31513065 jq实现批量图片上传 http://blog.csdn.net/lmj623565 ...
随机推荐
- Docker 快速入门(一)- 情况介绍和安装
欢迎您! 很高兴您想学习 Docker . 这个页面包含了如何开始使用 Docker 的循序渐进的说明. Docker 快速入门培训模块教你如何: 设置 Docker 环境(在本页) 构建并运行您的镜 ...
- int c, int ndigit[10]; ++ndigit[c-'0'];
for example c-'0' is an integer expression with a value between 0and 9 corresponding to the characte ...
- CentOS 关闭暂不需要的系统服务
需要保留的服务:crond.iptables.irqbalance.microcode_ctl.network.random.sshd.syslog.local 一 .使用命令:ntsysv 打开选项 ...
- python之shutil模块的使用
shutil模块 shutil模块是一种高级的文件操作工具,其对文件的复制与删除操作非常强大,shutil 名字来源于 shell utilities,该模块拥有许多文件(夹)操作的功能,包括复制.移 ...
- Selenium WebDriver使用
目录 介绍 selenium webdriver chromedriver下载安装 1.下载 2.使用 3.测试 WebDriver常用操作 1.浏览器操作 2.窗口和弹框操作 3.cookies 操 ...
- python学习_Linux系统的常用命令(二)
linux基本命令: 1.ls 的详细操作: ls - l : 以列表方式显示文件的详细信息 ls -l -h: 以人性化的方式显示文件的大小 ls -l -h -a 显示所有的目录和文件,包括隐藏文 ...
- pl/sql案例
项目生命周期: 瀑布模型 拿到一个项目后,首先:分析需要用到的SQL语句: 其次:分析需要定义的变量初始值是多少,怎么得到最终值: 案例一: 统计每年入职的员工数量以及总数量: SQL语句:selec ...
- 【XJOI】NOIP2020模拟训练题2 总结
得分情况: 估分: 30(T1)+100(T2)+0(T3)=130; 实际: 30(T1)+60(T2)+10(T3)=100; QAQ 是我高看自己了 T1 友好数对: 题意: 如果一个 ...
- Spring Aop基于注解的实现
一.AspectOriented Programing,面向切面编程. AOP主要用于日志记录,性能统计,安全控制(权限控制),事务处理,异常处理等.将日志记录,性能统计,安全控制,事务处理,异常 ...
- 看球的巴士——线性dp
[题目描述] 两个球队的支持者要一起坐车去看球,他们已经排成了一列.我们要让他们分乘若干辆巴士,同一辆巴士上的人必须在队伍中是连续的.为了在车上不起冲突,希望两队的支持者人数尽量相等,差至多是D.有一 ...