imageUpdate.js 3.04 KB
$(function () {
    //元素
    var oFileInput = $("#fileInput");				//选择文件按钮
    var sizeObj = [];								//存放每个文件大小的数组,用来比较去重
    //点击选择文件按钮选文件
    function handleUpdate() {
        if(flieList.length>=2) {
            layer.msg('已经完成上传最大限度', { icon: 5 });
            return false
        }else {
            analysisList(this.files, $("#fileInput"));
        }
    }

    //解析列表函数
    function analysisList(obj, inputName) {
        //如果没有文件
        if (obj.length < 1) {
            return false;
        }
        for (var i = 0; i < obj.length; i++) {
            var fileObj = obj[i];		//单个文件
            var name = fileObj.name;	//文件名
            var size = fileObj.size;	//文件大小
            //文件大于30M,就不上传
            if (size > 1024 * 1024 * 1024 || size == 0) {
                layer.msg('超过了30M,不能上传', { icon: 5 });
                return false;
            }
            //把文件大小放到一个数组中,然后再去比较,如果有比较上的,就认为重复了,不能上传
            if (sizeObj.indexOf(size) != -1) {
                layer.msg('已经选择,不能重复上传', { icon: 5 });
                return false;
            }
            //给json对象添加内容,得到选择的文件的数据
            var itemArr = [fileObj, name, size];	//文件,文件名,文件大小,文件类型
            flieList.push(itemArr);
            if (flieList.length==2){
                inputName.parent().find('.update').attr('src','../../staticImages/Yes.png');
                inputName.parent().find('.updatetext').text('')
            }
            //把这个文件的大小放进数组中
            sizeObj.push(size);
        }
        createList()				//生成列表
        document.querySelector('#fileInput').value = null
    };
    //生成列表
    function createList() {
        $('.fileListName').empty()
        for (var i = 0; i < flieList.length; i++) {
            var fileData = flieList[i];
            name = fileData[1]
            $('.fileListName').append(
                '<li class="fileName">'+
                '<span title="' + name + '">' + name + '</span>' +
                '<img class="operation" src="../../staticImages/chacha.png">'+
                '</li>'
            );
        }
    }
    $(document).on("click", ".fileListName .fileName .operation", function (e) {
        var index = $(this).parent().index();
        flieList.splice(index, 1)
        sizeObj.splice(index, 1)
        if(flieList.length==1) {
            $(this).parent().parent().parent('.fileSpan').find('.update').attr('src','../../staticImages/update.png');
            $(this).parent().parent().parent('.fileSpan').find('.updatetext').text('点击文件上传')
        }
        $(this).parent().remove()
    })
})
//通过文件名,返回文件的后缀名
function fileType(name) {
    var nameArr = name.split(".");
    return nameArr[nameArr.length - 1].toLowerCase();
}