php+mui+头像上传,MUI 拍照或选取照片上传作为头像

1.第一种方法是用H5来实现的

HTML：

JS：

$(function(){

$("#head_img_change").change(function() {

var $file = $(this);

var fileObj = $file[0];

var windowURL = window.URL || window.webkitURL;

var dataURL;

var $img = $("#headimg");

if(fileObj && fileObj.files && fileObj.files[0]){

dataURL = windowURL.createObjectURL(fileObj.files[0]);

$img.attr(‘src‘,dataURL);

}else{

dataURL = $file.val();

var imgObj = document.getElementById("headimg");

// 1、在设置filter属性时，元素必须已经存在在DOM树中，动态创建的Node，也需要在设置属性前加入到DOM中，先设置属性再加入，无效；

// 2、src属性需要像下面的方式添加，上面的两种方式添加，无效；

imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";

imgObj.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = dataURL;

}

});

})

说明：1)外部加个label是为了把让用户点击的时候在范围内的都会触发input

2)H5  input file上传图片，调用API:直接调用相机

调用相机、图片或者相册

注：部分android机只能调用本地相册，相机调用不了或者只能调用相机，不能调用相册。

3)此方法是网上的一种方法，做了兼容的，IE6以上都能正常运行。

2.第二种方法：MUI

1)内容链接：http://www.bcty365.com/content-146-3648-1.html

2)需要改一下  点击头像触发   里的

拍照触发的对象的ID名改成自己的就行了。

还需要修改一下   上传图片  里的一点代码就可以用了：

var mainImage= document.getElementById("headimg");

mainImage.src = imgPath;

说明：

这一部分改成上面的那两句就可以了，因为我原来放图片的地方设置有宽高，mainImage给它一个装图片的对象就行了。

原文：http://www.cnblogs.com/zjjDaily/p/6073036.html