Bootstrap fileinput layoutTemplates内 去掉缩略图下的上传按钮 及其他按钮或元素 也可重写指定元素 添加自定义图标等

参考  https://zhidao.baidu.com/question/2143865137819906308.html

 

上传小图标，用多文件同步上传的时候，有这个小图标操作的时候会出现各种情况，现在要把他们弄掉：

    

 

这里layoutTemplates为上传控件模板，可以在这里重写上传控件中的其他元素样式(空字符串表示无样式)：

 

------------------------------------------------------------

没去官网看文档，就直接自己顺着代码找一下吧：

上文js代码段中从$("#fileinputId").fileinput()  找到 layoutTemplates点进去fileinput.min.js源文件

文件是 xx.min.js 压缩文件，好，control+A 全文复制，网上找一个js解压网站，放入源码格式化一下，获得js代码(这里只展示layoutTemplates下代码)；这里所有的key对应的值为动态生成的上传控件中的各元素样式

layoutTemplates: {
	main1: '{preview}\n
\n
\n  {caption}\n
\n      {remove}\n      {cancel}\n      {upload}\n      {browse}\n    
\n
',
	main2: '{preview}\n
\n
\n{remove}\n{cancel}\n{upload}\n{browse}\n',
	preview: '
\n    {close}    
\n    
\n    
\n    
    
\n    
\n    
\n
',
	close: i,
	fileIcon: '',
	caption: '
\n  \n  \n
',
	modalMain: a,
	modal: '
\n  
\n    
\n      
{heading}
\n      \n      
{toggleheader}{fullscreen}{borderless}{close}
\n    
\n    
\n      
\n      
\n{prev} {next}\n    
\n  
\n
\n',
	progress: '
\n    
\n        {status}\n     
\n
',
	size: " ({sizeText})",
	footer: '
\n    
\n        
{caption}
\n        
{size}
\n    
\n    {progress}\n{indicator}\n{actions}\n
',
	indicator: '
{indicator}
',
	actions: '
\n    
\n        {download} {upload} {delete} {zoom} {other}    
\n
\n{drag}\n
',
	actionDelete: '{removeIcon}\n',
	actionUpload: '{uploadIcon}',
	actionDownload: '{downloadIcon}',
	actionZoom: '{zoomIcon}',
	actionDrag: '{dragIcon}',
	btnDefault: '{icon} {label}',
	btnLink: '{icon} {label}',
	btnBrowse: '
{icon} {label}
',
	zoomCache: '
{zoomContent}
'
},

根据单词挨个匹配吧，这里只匹配了几个  其他的自行探索

main1
main2
preview
close
fileIcon
caption
modalMain
modal
progress
size
footer # 底部所有元素 (包含所有图标)
indicator #「➕图标」
actions
actionDelete # 「删除图标」
actionUpload #「上传图标」
actionDownload
actionZoom
actionDrag # 图片回显，编辑时候显示的「拖动图标」
btnDefault
btnLink
btnBrowse
zoomCache

------------------------------------------------------------

最快的方式就是，上传页面F12审查元素，指针点到对应元素，复制class名，到上面的js代码段里搜一下，对应的key放到页面js的layoutTemplates下就行了

 

layoutTemplates: {
   actionDelete: '',//去掉删除图标
},

 

------------------------------------------------------------

还可以自定义添加元素覆盖掉现有元素

layoutTemplates: {
   actionUpload: '测试',//重写上传按钮元素
},