<label>
  <div class="myusercenter-image-none">
    <img src="" class="myusercenter-image" alt="">
    <input type="file" class="myusercenter-hard-img">
  </div>
</label>
// 上传头像
$(function() {
$('.myusercenter-hard-img').on('change', function(e) {
var files = e.target.files;
var reader = new FileReader();
reader.readAsDataURL(files[0], "UTF-8");
reader.onload = function(evt) {
var fileString = evt.target.result;
var date = {
"file": fileString
};
$('.myusercenter-image').attr('src', fileString); console.log(fileString) // $.post("", date).success(function (result) {
// alert("ok");
// });
}
})
})

js 上传头像img的更多相关文章

  1. js 上传头像

    css .con4{width: 230px;height: auto;overflow: hidden;margin: 20px auto;color: #FFFFFF;} .con4 .btn{w ...

  2. 上传头像,界面无跳转,php+js

    上传头像,界面无跳转的方式很多,我用的是加个iframe那种.下面直接上代码. html: //route 为后端接口//upload/avatar 为上传的头像的保存地址//imgurl=/uplo ...

  3. jQuery 自制上传头像插件-附带Demo实例(ajaxfileupload.js第三弹)

    这篇文章主要是对前两篇关于ajaxfileupload.js插件的文章 <ASP.NET 使用ajaxfileupload.js插件出现上传较大文件失败的解决方法(ajaxfileupload. ...

  4. Jcrop+uploadify+php实现上传头像预览裁剪

    最近由于项目需要,所以做了一个上传头像预览并且可以预览裁剪的功能,大概思路是上传的图片先保存到服务器,然后通过ajax从服务器获取到图片信息,再利用Jcrop插件进行裁剪,之后通过PHP获取到的四个裁 ...

  5. js 上传文件后缀名的判断 var flag=false;应用

    js 上传文件后缀名的判断  var flag=false;应用 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// ...

  6. asp.net mvc上传头像加剪裁功能介绍

    正好项目用到上传+剪裁功能,发上来便于以后使用. 我不能告诉你们其实是从博客园扒的前台代码,哈哈. 前端是jquery+fineuploader+jquery.Jcrop 后台是asp.net mvc ...

  7. asp.net mvc上传头像加剪裁功能

    原文:asp.net mvc上传头像加剪裁功能 正好项目用到上传+剪裁功能,发上来便于以后使用. 我不能告诉你们其实是从博客园扒的前台代码,哈哈. 前端是jquery+fineuploader+jqu ...

  8. mvc上传头像加剪裁功能

    asp.net mvc上传头像加剪裁功能 正好项目用到上传+剪裁功能,发上来便于以后使用. 我不能告诉你们其实是从博客园扒的前台代码,哈哈. 前端是jquery+fineuploader+jquery ...

  9. 上传头像,layui上传图片

    layui上传与bootstrap上传相似,只是不需要下插件, layui自带的已够用 先看一下前台界面,这里是用到的上传头像 先点击开始上传,头像上传至服务器中, 返回json添加至form表单中, ...

随机推荐

  1. 利用thrift在c++、java和python之间相互调用

    转自:http://blog.csdn.net/andy_yf/article/details/7487384 thrift做为跨语言调用的方案有高效,支持语言较多,成熟等优点:代码侵入较强是其弱点. ...

  2. Vue生命周期简介和钩子函数

    钩子就好像是把人的出生到死亡分成一个个阶段,你肯定是在出生阶段起名字,而不会在成年或者死亡的阶段去起名字.或者说你想在出生阶段去约炮,也是不行的.组件也是一样,每个阶段它的内部构造是不一样的.所以一般 ...

  3. JDK由浅到深的理解

    一.JDK的安装 二.JDK安装后目录下的文件夹的用处 bin:编译器(javac.exe); db:jdk从1.6之后内置Derby数据库,它是一个纯用Java实现的内存数据库,Apache的开源项 ...

  4. docker系列(一):docker基础与安装笔记

    1 什么是docker docker是基于GO语言编写的开源容器项目,诞生于2013年初,到目前为止,已经经历了6年的发展演变.现如今,docker已经非常火爆,特别是在一线IT企业,部署.运维等工作 ...

  5. Spring Cache无效的问题以及解决办法

    http://blog.csdn.net/kimylrong/article/details/50126979 @Cacheable标注的方法,如果其所在的类实现了某一个接口,那么该方法也必须出现在接 ...

  6. 远程报:这可能是由于credssp加密oracle修正

    此错误解决办法 1.Win+R 输入regedit打开注册表 找到对应的以下目录HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion ...

  7. POJ1961(kmp中Next数组的性质)

    对于某个位置i,i - Next[i]是循环节长度,i整除(i - Next[i])时是完整的几个循环元. ; int n, kase, Next[maxn]; char ch[maxn]; inli ...

  8. 7.1 Java集合概述

    List 有序.重复的集合 Set 无序.不可重复的集合 Map 具有映射关系的集合 jdk1.5之后.Java增加了Queue体系集合,代表一种队列集合实现

  9. Backbone学习记录(3)

    创建视图 同前面创建模型和集合的方式一样,Backbone.View.extend()即可创建视图 var UserView=Backbone.View.extend(); var view1=new ...

  10. idea使用Git提交代码时忽略指定文件或文件夹

    简述 使用idea编写代码并使用git作为版本控制器的时候,常常不需要提交配置文件以及一些其他不需要提交的文件,可以使用.ignore插件来在上传的时候忽略一些文件或文件夹. 安装 注意:安装完成之后 ...