PHP+ajaxfileupload+jcrop插件完美实现头像上传剪裁

昨天花了点时间整合了一下头像插件 东拼西凑的成果 先来看下效果

1.先使用ajaxfileupload插件做异步上传。这个地方我本来想做个上传进度的效果，但技术有限失败了。上传按钮我还做了一个文件大小的限制，但是由于浏览器兼容性的问题，不完美在IE6--IE9之间还有很多问题需要解决

getFileSize函数是用于判断文件大小的函数

代码如下:
function getFileSize(fileName) {
                var byteSize = 0;
                //console.log($("#" + fileName).val());
                if($("#" + fileName)[0].files) {
                    var byteSize  = $("#" + fileName)[0].files[0].size;
                }else {
    //此处由于有浏览器兼容问题 还没完成大小判断的逻辑
                }
                //alert(byteSize);
                byteSize = Math.ceil(byteSize / 1024) //KB
                return byteSize;//KB
            }

2.按钮上传事件绑定

代码如下:
$("#btnUpload").click(function () {
                var allowImgageType = ['jpg', 'jpeg', 'png', 'gif'];
                var file = $("#file1").val();
                //获取大小
                var byteSize = getFileSize('file1');
                //获取后缀
                if (file.length > 0) {
                    if(byteSize > 2048) {
                        alert("上传的附件文件不能超过2M");
                        return;