插件描述:html5 头像上传、更换、剪切插件

利用bootstrap样式排版已经点击功能,进行弹窗更换头像。modal的div中有form表单提交地址

以下方法由网友杜威提供

遇到的几个情况希望能帮助到大家,后台情况 ,1,后台先接受到form提交过来的图片,并返回json,他的sitelogo.js有ajax操作,要求返回json格式,并且有$arr = array ('result'=>路径);

echo json_encode($arr);

只要后台返回json格式的数据,并且里面有result 字段  路径{"result":"upload/1470198980a.png"}

基本上就跑通了,Content - Disposition: form - data;

name = "avatar_data" {

"x": 112.60000000000001,

"y": 45.10000000000001,

"height": 184.86043956043957,

"width": 184.86043956043957}

在拿到提交过来的裁剪等数据到后台,php用img一系列函数裁剪保存到原路径,覆盖到开始的图片,就完成了,我是这样的思路

个人中心html更换头像,html5 头像上传更换插件相关推荐

  1. html5文档样式,jQuery HTML5文件上传美化插件jQuery.filer

    插件描述:jQuery.filer是一款简单的HTML5文件上传组件美化jQuery插件.它能够完成单文件和多文件的上传,支持文件的拖拽,支持不同的文件格式校验,支持缩略图和图标等,是一款非常实用的文 ...

  2. jQuery HTML5文件上传美化插件jQuery.filer

    下载及详情参考jquery插件库:http://www.jq22.com/jquery-info11363       1.介绍和配置参数 更多配置参数 前往 jquery插件库 2.引入 css 和 ...

  3. html实现选择头像,HTML5实现上传头像图片大小选择(简单实现)

    HTML5仿微博图片上传后大小选择,请使用chrom或者FireFox运行.如果报SECURITY_ERR需要把文件放在服务器端.比如nginx里. 1.[代码][HTML]代码 New Docume ...

  4. 结合axios(formdata)+vue-cropper+element ui实现头像图片剪切上传

    萌新用vue + axios + formdata 上传文件的爬坑之路 https://blog.csdn.net/qq_41688165/article/details/80834842 结合vue ...

  5. html5 图片上传,支持图片预览、压缩、及进度显示,兼容IE6+及标准浏览器

    原文:html5 图片上传,支持图片预览.压缩.及进度显示,兼容IE6+及标准浏览器 以前写过上传组件,见 打造 html5 文件上传组件,实现进度显示及拖拽上传,兼容IE6+及其它标准浏览器,对付一 ...

  6. 【Demo】HTML5 拍照上传

    本文主要讲解 手机浏览器 如何拍照 为什么会有这个需求 最近做一个项目要用到拍照然后上传照片,但是网页拍照一般都是用Flash做的,而我们主要是H5页面,如果在微信里面有权限就可以通过JSSDK调起摄 ...

  7. HTML5关于上传API的一些使用(上)

    HTML5提供了很多有用的API,其中就包括上传的API,XMLHttpRequest2.0,在HTML5时代之前,需要进行二进制的上传一般都会才用flash的方案,但是当XMLHttpRequest ...

  8. html5支持ajax和jQuery吗,使用HTML5文件上传与AJAX和jQuery(Using HTML5 file uploads with AJAX and jQuery)...

    使用HTML5文件上传与AJAX和jQuery(Using HTML5 file uploads with AJAX and jQuery) 诚然,Stack Overflow上有类似的问题,但似乎并 ...

  9. HTML5 文件上传的2种方式

    原文地址:http://blog.csdn.net/lovelyelfpop/article/details/71421123 以前上传文件需要提交Form表单. HTML5方式上传文件,可以通过使用 ...

  10. HTML5文件上传域的小例子

    先上图 文件上传进度条.获取上传的文件信息.读取图片绑定到img元素之类的 代码 <!DOCTYPE html><html> <head><meta char ...

最新文章

  1. 2017年10月08日普及组 世界语
  2. php配置文件能直接用吗,我应该在PHP应用程序中使用YAML配置文件吗?
  3. CentOS 初体验二十四:redis常用命令:Set
  4. oracle中偏移,怎么对相同的坐标点偏移?
  5. 让 WPF 的 RadioButton 支持再次点击取消选中的功能
  6. asp.net链接mysql数据库------------【个人收集】
  7. [shiro学习笔记]第二节 shiro与web融合实现一个简单的授权认证
  8. [论文阅读] Shallow Attention Network for Polyp Segmentation
  9. navicat连接sqlserver出现im002错误
  10. 程序员面试题100题第03题——求子数组的最大和
  11. 中药的专利标准化研究
  12. 【CCNA第二天】路由器密码破解及恢复
  13. yml连接sqlserver_spring连接sqlserver数据库
  14. 2016年Kubernetes(k8s)大事记
  15. 技术岗找工作简历撰写方法
  16. JavaScript 中的“黑话”,你知多少?
  17. 液晶坏点如何鉴别 LCD显示器选购之道
  18. 算命大师元真先生解读周易人生命运
  19. 用C语言实现一个简单的计算器代码
  20. oralc UPDATE关联表的思路总结

热门文章

  1. 3DMAX机械建模贴图教程
  2. 医药生物行业:疫情反复,2021年医药板块如何演绎(20210103).PDF
  3. python获取股票的市盈率_怎样查找股票的历史市盈率数据?
  4. 仿头条新闻资讯dz模板/Discuz新闻资讯商业版GBK模板
  5. 苹果切图换算android,iOS、Android 开发单位换算及 UI 切图要求
  6. Houdini中四种实现龙卷风速度场的方法及比较
  7. 17篇点云处理综述-点云语义分割、点云物体检测、自动驾驶中的点云处理……
  8. 【基础概念】什么是benchmark model?
  9. R语言-文本文件读写 txt / csv / xlsx
  10. ejabberd XMPP服务器有用的配置及其介绍