<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. 20170412-sl

    force n实力,武力 v强迫 ---------------20170413-sl----------------------- discard   n/v 放弃 fetch n/v 拿,取 pu ...

  2. vector中插入pair

    我们知道map和multimap的作用,这两种数据类型在存储数据时,会根据pair<>的first成员进行排序,不同的时前者将不会插入对first成员重复的结构,后者可以.那如果我们只想存 ...

  3. mfc基于对话框的应用程序,如何设置初始对话框大小,移动控件位置

    void MmPLEntPropertyDlg::SetInitDialogSize() { CRect rectDlg; GetWindowRect(rectDlg);//x,y为对话框左上角的坐标 ...

  4. spoj SUBLEX - Lexicographical Substring Search【SAM】

    先求出SAM,然后考虑定义,点u是一个right集合,代表了长为dis[son]+1~dis[u]的串,然后根据有向边转移是添加一个字符,所以可以根据这个预处理出si[u],表示串u后加字符能有几个本 ...

  5. 深度 Mybatis 3 源码分析(一)SqlSessionFactoryBuilder源码分析

    MyBatis消除了几乎所有的JDBC代码和参数的手工设置以及对结果集的检索封装.MyBatis可以使用简单的XML或注解用于配置和原始映射,将接口和Java的POJO(Plain Old Java ...

  6. Apereo CAS Server服务端搭建教程

    不说废话了,直接看搭建过程吧. 首先到下载源码,https://github.com/apereo/cas-overlay-template/tree/4.2 附上地址,本次版本为4.2,下载源码后如 ...

  7. Codeforces Round #513解题报告(A~E)By cellur925

    我是比赛地址 A:Phone Numbers $Description$:给你一串数字,问你能组成多少开头为8的11位电话号码. $Sol$:统计8的数量,与$n$%11作比较. #include&l ...

  8. Contextual Action bar(3) 两个示例

    一.通过activity启动Context Action Bar 1.主java public class ActivityActionModeFrgmt extends Fragment imple ...

  9. Contextual Action bar(1) CAB in Android

    Contextual Action bar (CAB) in Android BY PARESH MAYANI - OCTOBER, 23RD 2013 Before getting into the ...

  10. 525 Contiguous Array 连续数组

    给定一个二进制数组, 找到含有相同数量的 0 和 1 的最长连续子数组.示例 1:输入: [0,1]输出: 2说明: [0, 1] 是具有相同数量0和1的最长连续子数组. 示例 2:输入: [0,1, ...