zoukankan      html  css  js  c++  java
  • 如何显示bootstrap fileinput缩略图上面的删除按钮

    bootstrap上传文件控件初始化js:

    //bootstrap上传文件控件
    $(".fileupload").fileinput({
        language: "zh",
        showUpload: false,
        //uploadUrl: "/Product/imgDeal",
        autoReplace: true,
        maxFileCount: 1,
    
        //allowedFileExtensions: ["jpg", "png", "gif"],
        browseClass: "btn btn-primary", //按钮样式 
        previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
        /* initialPreview: [
                 "<img src='http://xxx/1.png' class='file-preview-image' />",    
                 ], */
    });

    1.当注释掉uploadUrl的时候,缩略图上的上传、删除按钮会消失:

    2.当加上uploadUrl的时候,缩略图上的上传、删除按钮会出现

    注意:

    uploadUrl后面的内容不能为“”,它会影响到缩略图上按钮的显示,也会对拖拽区域(dropZoneEnabled)的显示有影响。

    附:

    初始化bootstrap文件上传控件的js:

    //bootstrap上传文件控件
      /*$(".fileupload").fileinput({
          language: 'zh', //设置语言
          uploadUrl: 'uploadUrl', //上传的地址
          allowedFileExtensions: ['jpg', 'gif', 'png'],//接收的文件后缀
          showUpload: false, //是否显示上传按钮
          showCaption: false,//是否显示标题
          browseClass: "btn btn-primary", //按钮样式
          //dropZoneEnabled: false,//是否显示拖拽区域
          //minImageWidth: 50, //图片的最小宽度
          //minImageHeight: 50,//图片的最小高度
          //maxImageWidth: 1000,//图片的最大宽度
          //maxImageHeight: 1000,//图片的最大高度
          //maxFileSize: 0,//单位为kb,如果为0表示不限制文件大小
          //minFileCount: 0,
          maxFileCount: 10, //表示允许同时上传的最大文件个数
          enctype: 'multipart/form-data',
          validateInitialCount:true,
          //previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
          msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}!"
      });*/
    
      $(".fileupload").fileinput({
          language: "zh",
          showUpload: false,
          uploadUrl: "/Product/imgDeal",
          autoReplace: true,
          maxFileCount: 1,
    
          //allowedFileExtensions: ["jpg", "png", "gif"],
          browseClass: "btn btn-primary", //按钮样式
          previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
          /* initialPreview: [
         "< img src='http://xxx/1.png' class='file-preview-image' />",
          ], */
      });
  • 相关阅读:
    python 如何把在字符串里面的名字变成变量,进行复制
    2017-05-30 英语
    RYU 中如钩构建TCP数据包,设置ACK等标志
    Arch linux LXR 安装过程
    ubuntu如何配置lxr
    2017-05-27 英语
    Emacs学习笔记:移动
    9.特殊矩阵的压缩存储
    13.链路层设备
    9.CSMA_CD协议
  • 原文地址:https://www.cnblogs.com/super-chao/p/8443853.html
Copyright © 2011-2022 走看看