个人中心修改头像总结

《个人中心修改头像总结》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、个人中心修改头像总结1,背景博客停了好久，主要是最近工作太忙了，还有就是身体状况没有以前那么好了，乘着国庆长假的空档，写下这篇一直想写的文章。运营平台是我主要致力的一个项目，这个项目分为四个大部分，个人中心，充值中心，客服中心，家长监护，最近主要忙着个人中心的重写和丰富，关于个人中心，无非就是对平台用户信息的自我管理，以及一些对用户帐号的安全保护措施，下图的菜单非常简要的说明了个人中心的功能。个人觉得最值得关注的就是密保设置和修改头像，因为之前没有处理过类似的问题，本文主要记录对头像的处理过程以及思考，希望给碰到类似问题的苦逼程序员

2、一点借鉴。个人中心整体功能一览2，头像处理xmind叽歪一句，个人碰到问题的时候，首先会分析问题，在分析问题的基础上，得到整体的解决方案，然后一步步分解步骤，去实现，首先奉上我的解决方案，也许不是最优的，但是按照个人的知识和技能水平，绝对是可以实现的。         修改头像mind3,实现步骤按照我的mind，首先是上传图片，先上效果图，然后给出实现的代码。首先是整体的结构图，做的比较丑，别喷哥··· 修改头像整体效果图下面按照mind一步步实现，首先：点击修改头像，弹出一个层，第一步：弹出上传图片的层，上传图片到服务器 对实现

3、细节不感冒的屌丝可以看看代码（结合哥的mind看可以事半功倍）：分层实现细节Html结构层这个可以免了，一般都可以弄出来Js连接层首先是弹出一个上传图片的层，然后上传图片到服务器端。$("#editHead").bind("click",function(){    showUploadDiv();  });  functionshowUploadDiv(){    $("#uploadMsg").empty();    $.fancybox({      type:'inline',      width:400,      hr

4、ef:'#uploadUserHead'    });}//fancybox弹出层上传的处理代码Servlet服务端处理层（commonupload实现）服务器端处理代码上传的处理代码 $(function(){    $("#uploadFrom").ajaxForm({      beforeSubmit:checkImg,      error:function(data,status){        alert(status+','+data);        $("#uploadMsg").html('上传文件超过1M!

5、');      },      success:function(data,status){       try{         varmsg=$.parseJSON(data);         if(msg.code==200)         {//如果成功提交           javascript:$.fancybox.close();           $("#uploadUserHead").hide();           vardata=msg.object;           $("#editImg"

6、).attr("src",data.path).show();           $("#preview1").attr("src",data.path).show();           $(".zoom").show();           $("#width").val(data.width);           $("#height").val(data.height);           $("#oldImgPath").val(data.realPath);           $("#imgFileExt")

7、.val(data.fileExt);           varapi,jcrop_api,boundx,boundy;           $('#editImg').Jcrop({             onChange:updatePreview,             onSelect:updatePreview,             aspectRatio:1,             bgOpacity:0.5,             bgColor:'white',             addClass

8、:'jcrop-light'           },function(){             api=this;             api.setSelect([130,65,130+350,65+285]);