Bootstrap fileinput配置「建议收藏」

Bootstrap fileinput配置「建议收藏」$(“#file”).fileinput({showUpload:false,overwriteInitial:false,maxFileCount:5,initialPreview:[“<imgsrc=’/profile/avatar/2019/08/29/d21d8a43f67ba3d7c07be23263e1b581.jp…

大家好,又见面了,我是你们的朋友全栈君。

$("#file").fileinput({
    showUpload:false,
    overwriteInitial:false,
    maxFileCount:5,
    initialPreview: [
        "<img src='/profile/avatar/2019/08/29/d21d8a43f67ba3d7c07be23263e1b581.jpg' 
            class='file-preview-image kv-preview-data' 
            style='width:auto;height:auto;max-width:100%;max-height:100%;'>",
        "<img src='/profile/avatar/2019/08/29/a2e0318c7bdc2b1cb02845bb0d43912d.jpg' 
            class='file-preview-image kv-preview-data' 
            style='width:auto;height:auto;max-width:100%;max-height:100%;'>",
    ],
    initialPreviewConfig: [
        {caption: '0bd5cc2106_hd.jpg', url: '/pic/remove', 
            key: 4, extra: {id: 4} },
        {caption: '97di-htfpvza3930503.jpg', url: '/pic/remove', 
            key: 5, extra: {id: 5} },
    ],
    fileActionSettings: {
        showRemove: true,
        showUpload: false,
        showDownload: false,
        showZoom: false,
        showDrag: false,
        removeIcon: '<i class="fa fa-trash"></i>',
        uploadIcon: '<i class="fa fa-upload"></i>',
        uploadRetryIcon: '<i class="fa fa-repeat"></i>'
    }
});

编辑页面:从数据表获取图片数据并显示,主要是【initialPreview】【initialPreviewConfig】这两个参数,本人是在后台把这两个配置组装好再传值到前台显示的。

效果图:

Bootstrap fileinput配置「建议收藏」

 

API:https://segmentfault.com/a/1190000018477200?utm_source=tag-newest#articleHeader5

 

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/135701.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 写字板(Windows程序设计)

    写字板(Windows程序设计)前言c正编译生成debug,exe等文件,同样也可以通过exe"反编译"生成相对应的文件,一劳永逸,任君选择(`・ω・´)(~~我们老师为了给我们看要求效果给了

    2022年7月1日
    24
  • buildroot 树莓派_树莓派忘记root密码

    buildroot 树莓派_树莓派忘记root密码下载源码wgethttps://buildroot.uclibc.org/downloads/buildroot-2016.11.2.tar.gz解压tar-xvfbuildroot-2016.11.2.tar.gz配置将入config目录查看相应配置文件cdconfigsls查找到树莓派相关配置文件进行配置makeraspberrypi0_defconfig配置选…

    2022年10月9日
    2
  • cnpm 安装yarn[通俗易懂]

    cnpm 安装yarn[通俗易懂]cnpm安装yarn一句命令搞定cnpminstall-gyarn–registry=https://registry.npm.taobao.org再配置下源yarnconfigsetregistryhttps://registry.npm.taobao.org-gyarnconfigsetsass_binary_si…

    2022年5月9日
    66
  • java8静态变量放在哪个区_jdk8.0 内存划分

    java8静态变量放在哪个区_jdk8.0 内存划分java1.8之前内存区域分为方法区、堆内存、虚拟机栈、本地方法栈、程序计数器。下图所示:方法区(MethodArea)与Java堆一样,是各个线程共享的内存区域,它用于存储已被虚拟机加载的类信息、常量、静态变量、即时编译器编译后的代码等数据。虽然Java虚拟机规范把方法区描述为堆的一个逻辑部分,但是它却有一个别名叫做Non-Heap(非堆),目的应该是与Java堆区分开来。很多人都更愿意把方…

    2022年6月12日
    146
  • SpringBoot声明式事务的简单运用

    SpringBoot声明式事务的简单运用关于事物的基本概念等这里就不介绍了。Spring声明式事物的实现,有两种方式;第一种是配置xml,第二种是使用相关注解(这两种方式可详见《程序员成长笔记(一)》的相关章节)。SpringBoot中默认配置了第二种方式,所以,SpringBoot直接使用注解即可。下面介绍SpringBoot通过注解开启事物的使用。SpringBoot使用事物的步骤:第一步:在启动类上开启…

    2022年5月30日
    37
  • 分子生物学词汇(L~O)

    分子生物学词汇(L~O)                lacoperon 乳糖操纵子                laccase 漆酶                lacmus 石蕊                lactalbumin 乳白蛋白,乳清蛋白                lactam 内酰胺                lactamase 内酰胺酶                la

    2022年7月11日
    47

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号