zoukankan      html  css  js  c++  java
  • 实现上传文件但隐藏选择文件的文字

    HTML代码:

    <span tabindex="0" class="ant-upload" role="button">
                        <input type="file" accept="" style="display: none;" id="clueImgInput" onchange="uploadClueImg()">
                        <a href="javascript:void(0)" id="clueImgUploadButton" class="btn-normal">
                            <span>上传图片</span>
                        </a></span>

    js触发点击选择文件代码:

    $("#clueImgUploadButton").click(function () {
            $("#clueImgInput").click();
        });

    上传的请求:

    function uploadClueImg() {
        var file_obj = document.getElementById('clueImgInput').files[0];
        var fd = new FormData();
        fd.append('file', file_obj);
        $.ajax({
            type: 'post',
            url: "uploadClueImg",
            data: fd,
            cache: false,
            processData: false,
            contentType: false,
        }).success(function (data) {
            if (data.code === 107){
                //上传成功
                var url = data.data;
                $(".add-picture-win img").attr('src','');
                $(".add-picture-win img").attr('src',url);
            }
        }).error(function () {
    
        });
    }

    后台
    /**
         * 上传文件
         * @param file
         */
        public static void uploadFile(String resourceName, MultipartFile file, String dataUrl){
            String filePath = dataUrl+resourceName+".xls";
            // 保存文件
            File tempSaveFile = new File(filePath);
    //        if (tempSaveFile.exists()){
    //            tempSaveFile.delete();
    //        }
            if (!file.isEmpty()) {
                BufferedOutputStream out;
                try {
                    out = new BufferedOutputStream(new FileOutputStream(tempSaveFile));
                    out.write(file.getBytes());
                    out.flush();
                    out.close();
                } catch (FileNotFoundException e) {
                    e.printStackTrace();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
  • 相关阅读:
    JS 字符串
    JS 变量
    JS 数据类型与运算符
    HTML加载动画实现
    DOM Document.readyState 属性
    html中怎么去掉input获取焦点时候的边框
    原生js获取子元素
    CSS3 Animation动画
    slice,substr和substring的区别
    a链接嵌套无效,嵌套链接最优解决办法
  • 原文地址:https://www.cnblogs.com/cailijuan/p/9360594.html
Copyright © 2011-2022 走看看