<script src="/static/js/jquery.js"></script>
// 前端页面实现头像预览
// 当用户选中文件之后,也就是头像的input标签有值时触发
$('#avatar').change(function () {
var file = this.files[0];
var fr = new FileReader();
fr.readAsDataURL(file);
fr.onload = function(){
$('#avatar-img').attr('src',fr.result) }
})

基于jquery读取input上传的文件内容的更多相关文章

  1. input上传限定文件类型

    input上传限定文件类型 accept="image/*"   限定为只能上传图片 accept=”audio/*   限定为只能上传音频 accept=”video/*” 限定 ...

  2. 自实现input上传指定文件到服务器

    遇到问题,解决问题,记录问题,成长就是一步一步走出来的. 一.添加 input 标签 我的工作中遇到了,需要上传pdf文件到服务器的需求,而且只能上传pdf文件,accept指定了 pdf 类型. & ...

  3. Springboot/SpringMvc 读取上传 xls 文件内容

    /** * 读取上传 xls 内容返回 * @param file * @return */@RequestMapping(value = "/read.xls")@Respons ...

  4. 基于Spring MVC实现基于form表单上传Excel文件,批量导入数据

    在pom.xml中引入: <!--处理2003 excel--> <dependency> <groupId>org.apache.poi</groupId& ...

  5. 基于jquery实现图片上传本地预览功能

    一.原理 分为两步: 当上传图片的input被触发并选择本地图片之后获取要上传的图片这个对象的URL(对象URL),把对象URL赋值给事先写好的img标签的src属性即可把图片显示出来.在这里,我们需 ...

  6. asp.net配置web.config支持jQuery.Uploadify插件上传大文件

    配置web.config有两处地方需要配置,分别是集成模式和经典模式. 集成模式: <!--文件上传大小设置--> <httpRuntime requestValidationMod ...

  7. Web API之基于H5客户端分段上传大文件

    http://www.cnblogs.com/OneDirection/articles/7285739.html 查询很多资料没有遇到合适的,对于MultipartFormDataStreamPro ...

  8. 删除input上传的文件路径

    上传文件时,选择了文件后想清空文件路径,搜索了一下,用两种方法解决 <input type="file" id="fileupload" name=&qu ...

  9. 【HTML】前台input上传限制文件类型

    仅限制xls文件上传 <input id="uploadSkufile" type="file" value="批量导入" style ...

随机推荐

  1. agc015D A or...or B Problem

    题意:求用若干个(至少一个)[A,B]中的数进行or操作能得到多少本质不同的数 $1 \leq A \leq B < 2^{60}$ 一直在想数位dp,看了题解之后感觉自己就是个sb 我们先把$ ...

  2. line-height的用法(一)

    行高”顾名思意指一行文字的高度.具体来说是指两行文字间基线之间的距离. 从上到下四条线分别是顶线.中线.基线.底线,很像才学英语字母时的四线三格,我们知道vertical-align属性中有top.m ...

  3. JS---案例:旋转木马

    案例:旋转木马 页面加载时候出现的效果,script标签写在head里面,body上面 显示一个图片散开的动画,遍历之后,把每个图片用封装的动画函数移动到指定目标(同时改变多属性:宽,透明度,层级,t ...

  4. 数据库Mysql监控及优化

    在做 性能测试的时候数据最重要,数据来源于哪里呢,当然是数据库了,数据库中,我们可以知道,数据从磁盘中要比从缓存中读取数据的时间要慢的多的多,还可以知道,同样的一个sql语句,执行的效率也不一样,这是 ...

  5. Docker.[2].安装Docker.

    Docker.[2].安装Docker. 学习Docker的时候,也是搜索了好多资料,捣鼓那些理论的东西.什么是镜像?什么是容器 ?特点?用途?.... 巴拉巴拉一大堆. 我这里不再讲述理论,只记录代 ...

  6. vs2015卸载、vs2008安装Visual Assist x

    卸载2015 参考博文 1. 手动卸载VS2015的主要部分: win10系统: 控制面板---程序和功能--Microsoft Visual Studio 2015---更改卸载 2. 下载工具并解 ...

  7. js将canvas保存成图片并下载

    <canvas id="canvas" width="400" height="400"></canvas> < ...

  8. PHPCMS快速建站系列之pc:get标签的应用

    GET标签使用方式如下: {pc:get sql="SELECT * FROM phpcms_member" cache="3600" page="$ ...

  9. 寻找 K8s 1.14 Release 里的“蚌中之珠”

    摘要: K8s 1.14 发布了,Release Note那么长,我们该从何读起? 本文由张磊.心贵.临石.徙远.衷源.浔鸣等同学联合撰写. Kubernetes 1.14.0 Release 已经于 ...

  10. Flask_Migrate数据库迁移

    migrate数据库迁移 有models,没有迁移仓库.本地新建数据库:首次创建迁移仓库.迁移脚本:执行迁移脚本生成数据库表: python manage.py db init python mana ...