圖片上傳webuploader

/** * 基於jquery的圖片上傳控件 */!function ($) {    "use strict";    //定義上傳事件    var upImgEvent = {        fileQueued: 'fileQueued',//文件加載的時候觸發        //statusChange: 'statuschange',        uploadSuccess: 'uploadSuccess',//文件上傳成功觸發默認路徑應該是固定的        uploadError: 'uploadError',//文件上傳報錯觸發        error: 'error'//文件上傳驗證報錯的時候觸發,好比大小,上傳重複圖片    };    //定義內部使用函數    var _util = {        _isSupportImage: function () {            var data = new Image();            var support = true;            data.onload = data.onError = function () {                if (this.width != 1 || this.height != 1) {                    support = false;                }            };            data.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";            return support;        }(),        _renderHtml: function (file) {            return $('<div class="file_img" id="' + file.id + '">' +            '<div class="delete"><a href="javascript:deleteImg(\'' + file.id + '\',1)">刪除</a></div>' +            '<span style="vertical-align: middle; display: inline-block; height: 100%;"></span>' +            '<img id="img' + file.id + '"  title="' + file.name + '" src="' + window.base + '/resources/images/loading_.gif" /> ' +            '<div id="wart" style="position:absolute;z-index:99;left:5px;top:10px;"><span style="color: blue">圖片正在上傳.請等待...</span><div>'+            '</div>')        },        _showError: function (code) {            $('body').hideLoading();            $("img").next().remove();            var text = null;            switch (code) {                case 'exceed_size':                    text = '文件太大了..請從新上傳';                    break;                case 'interrupt':                    text = '上傳暫停..';                    break;                default:                    text = '上傳失敗，請重試...';                    break;            }            alert(text);        }    };    var Img = function (element, options) {        var imgRadio = {            //圖片屬性            _ratio: function () {                if (window.devicePixelRatio) {                    return window.devicePixelRatio;                } else {                    return 1;                }            },  //像素比例            thumbWidth: 140 * this._ratio,            thumbHeight: 140 * this._ratio        };        //構造默認options        var defaultOption = {            packId:"#"+options.packId,            swf: window.base + '/resources/js/webuploader/Uploader.swf',//ie6,7,8 須要flash支持，默認優先Html5            server: "http://localhost:8080/person"+options.uploadPath,//文件上傳的服務器路徑            pick: {                id: "#"+options.uploaderId,                multiple: options.isMultiple//是否單選            },            duplicate: true,//能夠重複            sendAsBinary: true,//android4 有些機型必須開啓 爲了兼容 都啓用這種模式            auto: true,//開啓選擇圖片自動上傳            fileVal: 'bin',//文件上傳字段名稱            fileSingleSizeLimit: 10 * 1024 * 1024,  //10M 單個圖片只能最大10M            disableGlobalDnd: true,//不能拖拽            accept: {                //上傳圖片所支持的類型                title: "上傳圖片",                extensions: 'gif,jpg,jpeg,bmp,png',                mimeTypes: 'image/*'            },            resize: false,//不壓縮image, 默認若是是jpeg，文件上傳前會壓縮一把再上傳！            //壓縮            compress: {                width: 1600,                height: 1600,                // 圖片質量，只有type爲`image/jpeg`的時候纔有效。                quality: 90,                // 是否容許放大，若是想要生成小圖的時候不失真，此選項應該設置爲false.                allowMagnify: false,                // 是否容許裁剪。                crop: false,                // 是否保留頭部meta信息。                preserveHeaders: true,                // 若是發現壓縮後文件大小比原來還大，則使用原來圖片                // 此屬性可能會影響圖片自動糾正功能                noCompressIfLarger: false,                // 單位字節，若是圖片大小小於此值，不會採用壓縮。                compressSize: 1024 * 1024 * 1            },            callback:undefined || options.callback,            success:undefined || options.success        };        this.init(defaultOption,imgRadio);    };    Img.prototype.init = function (options,radio) {        var uploader = WebUploader.create(options);        //構造監聽事件        uploader.on(upImgEvent.fileQueued, function (file) {            $('body').showLoading();            $(options.pick.id).showLoading();            if (file.getStatus() === 'invalid') {                _util._showError(file.statusText);            }            if(options.callback!=undefined && options.callback instanceof Function){                this.makeThumb(file, function (error, src) {                    if (error) {                        console.log("can not preview :" + error);                        return;                    }                    if (_util._isSupportImage) {                        options.callback.apply(this,[file,src]);                    }                }, radio.thumbWidth, radio.thumbHeight);            }else{                var html = _util._renderHtml(file);                //構造預覽圖                this.makeThumb(file, function (error, src) {                    var img = $("#img" + file.id);                    if (error) {                        console.log("can not preview :" + error);                        return;                    }                    if (_util._isSupportImage) {                        img.empty().attr('src', src);                    }                }, radio.thumbWidth, radio.thumbHeight);                html.appendTo($(options.packId));            }        });        uploader.on(upImgEvent.uploadSuccess, function (file, response) {            if (response.success) {                $('body').hideLoading();                $(options.pick.id).hideLoading();                $("img").next().remove();                var imgResponse = response.data;                if(options.success!=undefined && options.success instanceof Function){                    options.success.apply(this,[file,imgResponse]);                }            }else{                $('body').hideLoading();                $("img").next().remove();                alert(response.msg);            }        });        uploader.on(upImgEvent.uploadError, function (file) {            $('body').hideLoading();            $("img").next().remove();            alert("文件上傳失敗" + file.name);        });        uploader.on(upImgEvent.error, function (code) {            $('body').hideLoading();            $("img").next().remove();            if (code === 'F_DUPLICATE')                alert("文件已經存在.請換個圖片從新上傳...");            else if (code === 'F_EXCEED_SIZE')                alert("文件不能超過10M,請從新上傳");            else if (code === 'Q_TYPE_DENIED')                alert("文件類型只能是圖片類型,請從新上傳");            else                alert("error type :" + code);        });    };    $.webUploader = function (options) {        return new Img(this, options);    }}(window.jQuery);function deleteImg(id, type){    $("#" + id).remove();    //若是是sybd則顯示上傳插件    if (type == 1) {        $("#sybd").parent().show();    }}