自定义上传按钮，ajxa 上传

 

<div id="fileupload">
        <input id="file" type="file" style="display: none;"> <a
            id="btn" href="#" class="easyui-linkbutton"
            data-options="iconCls:'icon-redo'" onclick="fileUpload('file')">点击上传</a>
        <div id="urlDiv"></div>
    </div>

    function fileUpload(id) {
        myUpload({
            url : rootPath + "/file/upload.do",
            maxSize : 10,//大小限制
            fileType : [ 'pdf' ],//文件类型
            fileId : id,//文件输入框id
            beforeSend : function(file) {
                //上传前的操作 ，可以打开进度条
            },
            //回调函数
            callback : function(res, status) {
                var res = eval('(' + res + ')');
                if (status == 200) {
                    if (res.isSuccess) {
                        $.messager.alert('提示', '文件上传成功');
                        $('#urlDiv').append('<input id = "url" type="text">');
                        $('#url').val(res.url);
                    } else {
                        $.messager.alert('提示', '文件上传失败');
                    }

                } else {
                    $.messager.alert('提示', '文件上传失败');
                }

            },
            uploading : function(pre) {
                //上传中操作   
            }
        });

    }
    function myUpload(option) {
        var fd = new FormData(), xhr = new XMLHttpRequest();
        var input = $('#' + option.fileId);
        if (input.outerHTML) {
            input.outerHTML = input.outerHTML;
        } else { // FF(包括3.5)
            input.value = "";
        }
        input.click();
        // var fileType = [ 'pdf', 'png' ];
        input
                .change(function() {
                    if (!this.value) {
                        return;
                    }
                    var type = this.value.split('.').pop();
                    if (option.fileType.indexOf(type.toLocaleLowerCase()) == -1) {
                        alert("暂不支持该类型的文件，请重新选择!");
                        return;
                    }
                    for (var i = 0, file; file = this.files[i++];) {
                        if (option.maxSize
                                && file.size > option.maxSize * 1024 * 1024) {
                            alert('请上传小于' + option.maxSize + 'M的文件');
                            return;
                        }
                    }
                    if (option.beforeSend instanceof Function) {
                        if (option.beforeSend(this) === false) {
                            return false;
                        }
                    }

                    fd.append('imgFile', this.files[0]);
                    xhr.open('post', option.url);
                    // xhr.setRequestHeader("Content-type", "multipart/form-data");
                    xhr.send(fd);

                    xhr.onload = function() {
                        if (option.callback instanceof Function) {
                            option.callback(xhr.responseText, xhr.status);
                        }
                    }
                    xhr.upload.onprogress = function(event) {
                        var pre = Math.floor(event.loaded / event.total * 100
                                | 0);
                        if (option.uploading instanceof Function) {
                            option.uploading(pre);
                        }
                    }
                })
    }