JavaScript - Bootstrap ファイル入力サムネイルの上にあるアップロード削除ボタンを削除するにはどうすればよいですか?
我想大声告诉你
我想大声告诉你 2017-05-16 13:11:00
0
1
1252

< /p>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    文字列パス = request.getContextPath();
    文字列basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
    <頭>
        <メタ文字セット="utf-8">
        <title>画像上転送</title>
        <!-- jq -->
        <script type="text/javascript" src="<%=basePath%>static/plugs/jquery-3.1.1.min.js"></script>
        
        <!-- ブートストラップ -->
        <link rel="stylesheet" href="<%=basePath%>static/plugs/bootstrap/css/bootstrap.min.css">
        <script type="text/javascript" src="<%=basePath%>static/plugs/bootstrap/js/bootstrap.min.js"></script>
        
        <!-- 画像上即使用预览插件 -->
        <link rel="stylesheet" href="<%=basePath%>static/plugs/bootstrap-fileinput/css/fileinput.min.css">
        <script type="text/javascript" src="<%=basePath%>static/plugs/bootstrap-fileinput/js/fileinput.min.js"></script>
        <script type="text/javascript" src="<%=basePath%>static/plugs/bootstrap-fileinput/js/locales/zh.js"></script>
        
        <スタイル>
            .container{パディングトップ:60px}
        </スタイル>
    </head>
    <本体>
        <p class="コンテナ">
            <p class="行">
                <p class="col-sm-6col-sm-offset-3">
                    <form class="form-horizo​​ntal" role="form" method="post" action="<%=basePath%>uploadFile" enctype="multipart/form-data" >
                        <p class="フォームグループ">
                            <label class="col-sm-2 control-label">説明</label>
                            <p class="col-sm-10">
                                <input type="text" name="describ" class="col-sm-10 form-control" placeholder="请描述">
                            </p>
                        </p>
                        <p class="フォームグループ">
                            <label class="col-sm-2 control-label">文件</label>
                            <p class="col-sm-10">
                                <input type="file" name="myfile" data-ref="url" class="file-loading myfile" accept="text/plain" multiple/>
                                <input name="myfile" type="file" class="file myfile" multiple data-show-upload="false" data-show-caption="true">
                                
                            </p>
                        </p>
                        <p class="フォームグループ">
                            <label class="col-sm-2 control-label">封面</label>
                            <p class="col-sm-10">
                                <input type="file" name="myfile" data-ref="url2" class="col-sm-10 myfile" multiple/>
                            </p>
                        </p>
                        <button type="submit" class="btn btn-defaultcol-sm-2col-sm-offset-4">提交</button>
                    </フォーム>
                </p>
            </p>
        </p>
    
        <スクリプト>
        
            /* var imgObj = document.getElementById("myfile");
            アラート(imgObj); */
            $(".myfile").fileinput({
                UploadUrl:"<%=basePath%>uploadFile",// 上の地址
                UploadAsync:false, //默认异步上传
                showUpload: false, //否か表示上传按钮,跟随文本框的那个
                showRemove : true, //显示移除按钮,跟随文本框的那个
                showCaption: true,//否か标题,就是那个文本框
                showPreview : true, // 否か表示预览,不写默认は true
                dropZoneEnabled: false,// 表示領域が表示されているかどうか、true であると認識されていますが、大領域を占有しています
                //minImageWidth: 50, //画像の最小幅
                //minImageHeight: 50,//画像の最小高さ
                //maxImageWidth: 1000,//写真の最大幅
                //maxImageHeight: 1000,//写真の最大高さ
                //maxFileSize: 0,//单位がkb、0の場合は無制限のファイルサイズを表示
                //minFileCount: 0,
                 maxFileCount: 4, // 同時に送信される最大ファイル数を表示します
                 //enctype: 'multipart/form-data',
                 validateInitialCount:true、
                 reviewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
                 msgFilesTooMany: "选择上传的文件数({n}) 超过允许の最大数值{m}!",
                 allowedFileTypes: ['image','text'],//配置允许文書上の種類
                 allowedPreviewTypes : [ 'image','text'],// 配置されたすべての被定義ファイルの種類
                 allowedPreviewMimeTypes : [ 'jpg', 'png', 'gif' ,'txt'],//制御被预览的すべての mime タイプ
                 言語: 'zh'
            })
            //异步上传返結果处処理
            $('.myfile').on('fileerror', function(event, data, msg) {
                console.log("ファイルエラー");
                コンソール.ログ(データ);
            });
            //异步上传返し结果处処理
            $(".myfile").on("fileuploaded", 関数 (イベント、データ、プレビュー ID、インデックス) {
                console.log("ファイルがアップロードされました");
                var ref=$(this).attr("データ参照");
                $("input[name='"+ref+"']").val(data.response.url);

            });

            //同上传错误处理
            $('.myfile').on('filebatchuploaderror', function(event, data, msg) {
                console.log("ファイルバッチアップロードエラー");
                コンソール.ログ(データ);
            });
            
            //同上传返結果处処理
            $(".myfile").on("filebatchuploadsuccess", 関数 (イベント、データ、プレビュー ID、インデックス) {
                console.log("ファイルバッチアップロード成功");
                コンソール.ログ(データ);
            });

            //上前
            $('.myfile').on('filepreupload', function(イベント, データ, プレビュー ID, インデックス) {
                console.log("ファイルプレアップロード");
            });        
        </スクリプト>
    </ボディ>
</html>
我想大声告诉你
我想大声告诉你

全員に返信(1)
曾经蜡笔没有小新

公式ドキュメントのオプション(設定)では

ファイルの削除/クリアボタンを表示するかどうかのブール値。デフォルトは true です これを false に設定することもできます

いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート