上传头像

<div class="commodityImg_evaluate">
<div class="ge_pic_icon_Infor">
<img onclick="getElementById(‘file‘).click()" title="点击添加图片" alt="点击添加图片" src="images/tianjia.png">
</div>
<div class="Infor_file">
<input type="file" multiple="multiple" id="file" name=‘img‘ style="height:0;width:0;z-index: -1; position: absolute;" onchange="getPhoto(this)"/>
</div>
</div>

// 调用相册
function getPhoto(node) {
var imgURL = "";
try{
var file = null;
if(node.files && node.files[0] ){
file = node.files[0];
}else if(node.files && node.files.item(0)) {
file = node.files.item(0);
}
//Firefox 因安全性问题已无法直接通过input[file].value 获取完整的文件路径
try{
imgURL = file.getAsDataURL();
}catch(e){
imgRUL = window.URL.createObjectURL(file);
}
}catch(e){
if (node.files && node.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
imgURL = e.target.result;
};
reader.readAsDataURL(node.files[0]);
}
}
creatImg(imgRUL);
return imgURL;
}
function creatImg(imgRUL){
var textHtml = "<img src=‘"+imgRUL+"‘/>";
$(".myNews_Headportrait").html(textHtml);
//uoloadImg();
//console.log(imgRUL)
}
// 上传图片
$("#file").change(function(){
//创建FormData对象
var dataImg = new FormData();
//为FormData对象添加数据
$.each($(‘#file‘)[0].files, function(i, file) {
dataImg.append(‘img‘, file);
});
$.ajax({
url:‘‘+url+‘/appupload/upload‘,
type:‘POST‘,
data:dataImg,
cache: false,
contentType: false, //不可缺
processData: false, //不可缺
success:function(data){
console.log(data);
//data = $(data).html();
}
});
});

时间: 2024-07-30 12:29:35

上传头像的相关文章

file API+JCrop 选择、裁剪并上传头像

file API,直接读取本地文件,绕过了后台处理再返回前台的过程,使编程更简单.fileAPI和JCrop的结合使用上传头像. 1.html部分 <input id="demo" type="file" onchange="showPic();"/> <img id="avatar" src=""> 2.fileAPI预览图片(jquery) <script type=&qu

刚完成的一个上传头像模块,望指点(含详细代码)

file API,直接读取本地文件.fileAPI和JCrop的结合使用上传头像. 1.html部分 <input id="demo" type="file" name="file" onchange="showPic();"/> <img id="avatar" src="" style="width:200px"> 2.fileAPI预览图

[实战]MVC5+EF6+MySql企业网盘实战(4)——上传头像

写在前面 最近又开始忙了,工期紧比较赶,另外明天又要去驾校,只能一个功能一个功能的添加了,也许每次完成的功能确实不算什么,等将功能都实现了,然后在找一个好点的ui对前端重构一下. 系列文章 [EF]vs15+ef6+mysql code first方式 [实战]MVC5+EF6+MySql企业网盘实战(1) [实战]MVC5+EF6+MySql企业网盘实战(2)——用户注册 [实战]MVC5+EF6+MySql企业网盘实战(3)——验证码 [实战]MVC5+EF6+MySql企业网盘实战(4)—

WebAPI实现移动端上传头像接口

测试时可以直接使用PostMan模拟发送请求 /// <summary> /// 手机端上传头像接口 /// </summary> /// <param name="LoginToken"></param> /// <param name="Base64String"></param> /// <returns></returns> [HttpPost] public a

相册选择头像或者拍照 上传头像以NSData 图片二进制格式 表单上传

一.点击头像图片 或者按钮 在相册选择照片返回img,网络上传头像要用data表单上传 (1)上传头像属性 // 图片二进制格式 表单上传 @property (nonatomic, strong) NSData *imageWithData; (2)头像点击事件 - (void)headImageEvent{ NSLog(@"上传头像"); [self selectPhotoAlbumWithSelectPhotoHandle:^(UIImage *img) { self.heade

Discuz!NT Flash无法上传头像,点击上传后无任何反应

最近在对一个Discuz!NT论坛的老项目进行维护和二次开发,遇到了论坛无法上传头像的问题.在网上找了相当多的资料,发现解决的方法基本是无效的.虽然有的状况一样,但是没有解决方法,后来自己研究了下也总算是解决了这个问题. 首先说明下出现无法上传头像的具体症状,大概的症状有下面这几点: 使用Flash头像上传时,点击上传图片,然后显示“图片载入中,请稍后的提示信息”和上传进度的百分比,最后却是没有任何的反应. 网上有部分网友说到进度到10%就没有任何反应,其实只是部分情况,如果传大图片的话会显示其

Android基础之——startActivityForResult启动界面并返回数据,上传头像

在android应用的开发过程中,经常会出现启动一个界面后填写部分内容后带着数据返回启动前的界面,最典型的应用就是登录过程.在很多应用程序的模块中,都有"我的"这个模块,在未登录状态下点击其中的某一项,就会弹出登录界面,登录完成后回到我的界面,会显示一些登录后的数据,这个功能的实现就要用到startActivityForResult. 下面通过一个小demo来说明一下startActivityForResult的使用,以及在实际开发中的一些应用. demo的效果图如下: 主界面布局:

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

最近由于项目需要,所以做了一个上传头像预览并且可以预览裁剪的功能,大概思路是上传的图片先保存到服务器,然后通过ajax从服务器获取到图片信息,再利用Jcrop插件进行裁剪,之后通过PHP获取到的四个裁切点的坐标进行裁剪. 首先看一下uploadify上传插件的API: uploader : uploadify.swf 文件的相对路径,该swf文件是一个带有文字BROWSE的按钮,点击后淡出打开文件对话框,默认值:uploadify.swf.script :   后台处理程序的相对路径 .默认值:

php实现手机拍照上传头像功能

现在手机拍照很火,那么如何使用手机拍照并上传头像呢?原因很简单,就是数据传递,首先手机传递照片信息,这个就不是post传递 也不是get函数传递, 这个另外一种数据格式传递,使用的是$GLOBALS ['HTTP_RAW_POST_DATA'],这个系统函数跟post很相似,但是$GLOBALS ['HTTP_RAW_POST_DATA']支持的数据格式更丰富些,详细的区别请自己百度谷歌. 设计流程就是: $GLOBALS ['HTTP_RAW_POST_DATA']传递照片数据流(二进制)--

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

正好项目用到上传+剪裁功能,发上来便于以后使用. 我不能告诉你们其实是从博客园扒的前台代码,哈哈. 前端是jquery+fineuploader+jquery.Jcrop 后台是asp.net mvc 4 核心的js调用代码是crop.js和helper文件夹下的ImgHandler.cs 效果图 前台代码 <link href="~/Content/fineuploader.css" rel="stylesheet" /> <link href=